html,js简单保存textarea换行格式

  

有时候我们在做表单提交时,往往需要把html标签保存起来,但是textarea不保存换行的信息,所以我们需要用js来实现保存textarea的换行等HTM标签。
真正让HTML文本框里的换换等格式保留下来。
如果你有需要用到,直接复制以下textarea换行等格式保留下来的代码就可以了,代码如下:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>让HTML文本框textarea里的换行等格式用js保留下来</title>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
<textarea name="textContent" cols="100" rows="15" id="textContent"></textarea>
<br />
<input type="button" name="Submit" value="转换输出" onclick="outHTML()" />
<input name="checkbox" type="checkbox" id="checkbox" value="checkbox" checked="checked" />
<label for="checkbox" style="color:#F00">启用转换输出</label>
</form>
<div id="out" style="border:1px solid #F90; padding:10px; background:#FFF8DC; margin-top:10px">请在上面

文本框录入带HTML标记的文本测试!</div>
<script type="text/javascript">
/**********************************************************
* author Tang Guohui, created: 2007-12-9 12:30:15
**********************************************************/
function outHTML() {
var getValue=document.getElementById("textContent").value;
var endValue=((getValue.replace(/<(.+?)>/gi,"&lt;$1&gt;")).replace(/ /gi,"&nbsp;")).replace(/\n/gi,"<br/>");
/*
(1)转义“<”、“>”
(2)改半角空格为&nbsp;
(3)保留换行
*/
if (document.getElementById("checkbox").checked==true) {
document.getElementById("out").innerHTML=endValue;
}else{
document.getElementById("out").innerHTML=getValue;
}
}//end outHTML function
</script>
</body>
</html>

这只是一个让HTML文本框textarea里的换行等格式用js保留下来的模型,你还需要开发一下才能满足你的需求,希望岑溪网站开发分享给你的内容对你有所帮助!转载请注明出处,谢谢!

时间: 2024-11-02 23:26:17

html,js简单保存textarea换行格式的相关文章

HTML元素title里面和js里面几句话如何换行 格式代码是如何的?

在调试代码的时候我就遇到一个问题,HTML元素title里面通常只显示一行,那我想要他换行,就是多行显示,如何实现?JS代码里面比如Alert里面又该如何换行? 经过我的一番实验 要实现这种效果有几种方法,并且非常简单: 在HTML元素中,可以使用:1.直接按"回车键"换行,代码中换行,实际中也会换行   2.用代码换行,只要在想要换行的地方输入这两个" "和" "任意中的一个都达到实现换行的效果!          在JS代码中,想要类似提示框

用js实现保存文本框信息

看知乎等大型网站都实现自动保存文本框内容,我就用js简单地实现这个功能,用到了onblur事件跟onload事件,保存到本地cookie(为减轻服务器负担,一般人都不加用session来做吧?) <body > <script type="text/javascript"> function savecontent() { var kk=""; var content=document.getElementById("text&qu

js简单显示和隐藏div,触发超链接,动态更改button值,setInterval()简单使用,jquery easyui弹出框简单使用 .

js简单显示和隐藏div 01.<!DOCTYPE html> 02.<html> 03.<head> 04.<meta charset="UTF-8"> 05.<title>Insert title here</title> 06.<script type="text/javascript"> 07. window.onload=function(){ 08. document.g

HTML里面Textarea换行总结

近期碰到一个数据转来转去转到Textrea里面能否真正按行存放的问题,在这里总结一下: 问题描写叙述: 比方get数据到一个TextArea里面,如“AAA BBB”,想把这段文字在TextArea里面真正按行存放,而不是显示出来按行存放(所谓的真正按行存放就是,再把这个TextArea的数据post到另外一个页面的Textarea里面仍是按行存放) 问题解决1: 一開始是提交数据的时候格式是AAA<BR />BBB,可是这是显示换行,事实上在TextArea里面并非真正按行存放的,由于这个时

JS简单的倒计时(代码优化)

倒计时网上一大堆,所以也没有什么好说的,支持:1.年,月,日,天,时分秒等倒计时. JS代码如下: /* * js简单的倒计时 * @param {date,obj} 日期 对象格式 */ function CountDown(date,obj) { var self = this; self.date = date; self.obj = obj; self._init(); }; $.extend(CountDown.prototype,{ _init: function(){ var se

jquery.cycle.js简单用法实例

样式: a{text-decoration: none;} *{margin:0; padding:0;} /*容器设置*/ .player { width:216px; height:248px; background:url(http://i2.itc.cn/20120117/2cc0_da8f6c82_c8da_693d_7714_9533a013006a_3.jpg) no-repeat; background-color:#ede1d1; position:relative; padd

Google Chrome 调试JS简单教程[更新]

题外话,刚开始我写这篇内容只是将自己了解的一些知识放上来,不巧的是我分析了我的来访日志,很多朋友都有这个需求,为了大家没有白来,我决定充实下这篇文章.最近更新时间2014-02-14 chrome版本: 32.0.1700.107 m 我是一名忠实Chrome迷,使用它已经快有2年的历史了,整体给我的感觉就是清爽,快速,简洁.又打小广告了……^_^,虽然我知道IE8+也有调试工具,包括火狐的什么XXBUG,但是我用过之后,个人还是十分偏爱chrome的debug. chrome对于在前端打拼的兄

Js使用正则表达式判断邮箱格式

1 <html> 2 <head> 3 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 4 <title>验证Email是否正确</title> 5 <script language="javascript"> 6 function checkemail(str){ 7 //在Jav

简单的textarea限制字符输入效果(from www.sysoft.cc)

测试成功,一个简单的textarea限制输入字符效果,还是有待完善.可以限制键盘输入和粘贴操作了……‘ js代码段 $(function () { $("#myContent").keyup(function () { var textcount = parseInt($("#textcount").text()); var curcount = 2000-$(this).val().length ; if (curcount >= 0) { $("