关于textarea提交的内容无法换行的解决办法


Posted in Javascript onApril 09, 2013

当我们在页面上通过 textarea 提交数据的时候,我们我们输入的内容在提交后都会被处理为了一段内容,即使我们在 textarea 里面输入了很多的换行,提交后也是一段内容,那如果我们需要将我们输入的信息按照输入的形式保存下来该如何做呢?

这里面存在一个主要的问题是在页面显示的时候换行符是 <br /> 标签,而内容在 textarea 中显示时的换行符是 \n ,下面介绍一种方法通过 js 将输入的内容中的换行符转换为网页中的换行符。在网页数据提交钱作如下处理即可。

<script type="text/javascript"> 
//回车转换行
var content=document.getElementById("content").value; 
content=content.replace('\n','<br />'); 
document.getElementById("content").value=content;
//然后提交
</script>

在页面中显示的时候同样需要经过一下处理,与以上处理过程正好相反:

content=content.replace('<br />','\n');

下面对 js 的 replace 函数做一下解释:

语法:

stringObject.replace(regexp/substr,replacement)

replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。

一、替换单个字符

<script language="javascript">
var str="javascript is a good script language";
alert(str.replace("a","A"));//输出jAvascript is a good script language
</script>

二、替换字符串中存在的指定的所有字符(全部替换)

<script language="javascript">
var str="javascript is a good script language";
alert(str.replace(/a/g,"A"));//输出jAvAscript is A good script lAnguAge
</script>

上述的/g,是正则表达式,这说明,在replace()还可以使用正则表达式。

当然 replace 还有更高级的用法,大家可以相关文档获取更多更多的高级用法。


Javascript 相关文章推荐
javascript应用:Iframe自适应其加载的内容高度
Apr 10 Javascript
Javascript 布尔型分析
Dec 22 Javascript
Javascript学习笔记1 数据类型
Jan 11 Javascript
javascript实现倒计时N秒后网页自动跳转代码
Dec 11 Javascript
深入分析Cookie的安全性问题
Mar 01 Javascript
JavaScript实现把rgb颜色转换成16进制颜色的方法
Jun 01 Javascript
JavaScript 数据类型详解
Mar 13 Javascript
基于react框架使用的一些细节要点的思考
May 31 Javascript
jQuery选择器中的特殊符号处理方法
Sep 08 jQuery
Three.js实现3D机房效果
Dec 30 Javascript
JavaScript实现手机号码 3-4-4格式并控制新增和删除时光标的位置
Jun 02 Javascript
Vue打包部署到Nginx时,css样式不生效的解决方式
Aug 03 Javascript
关于JQuery($.load)事件的用法和分析
Apr 09 #Javascript
关于JS判断图片是否加载完成且获取图片宽度的方法
Apr 09 #Javascript
关于JavaScript中的关联数组分析
Apr 09 #Javascript
分析Node.js connect ECONNREFUSED错误
Apr 09 #Javascript
Node.js生成HttpStatusCode辅助类发布到npm
Apr 09 #Javascript
jQuery学习笔记(3)--用jquery(插件)实现多选项卡功能
Apr 08 #Javascript
jQuery学习笔记(2)--用jquery实现各种模态提示框代码及项目构架
Apr 08 #Javascript
You might like
特详细的PHPMYADMIN简明安装教程
2008/08/01 PHP
PHP开发中常用的8个小技巧
2008/08/27 PHP
PHP中SimpleXML函数用法分析
2014/11/26 PHP
手把手编写PHP框架 深入了解MVC运行流程
2016/09/19 PHP
javascript动画效果类封装代码
2007/08/28 Javascript
JS 日期验证正则附asp日期格式化函数
2009/09/11 Javascript
js获取单元格自定义属性值的代码(IE/Firefox)
2010/04/05 Javascript
js获取当前select 元素值的代码
2010/04/19 Javascript
Javascript的并行运算实现代码
2010/11/19 Javascript
父元素与子iframe相互获取变量和元素对象的具体实现
2013/10/15 Javascript
js整数字符串转换为金额类型数据(示例代码)
2013/12/26 Javascript
node.js中的events.emitter.once方法使用说明
2014/12/10 Javascript
js实现仿Discuz文本框弹出层效果
2015/08/13 Javascript
jquery表单验证需要做些什么
2015/11/17 Javascript
Angular.js与Bootstrap相结合实现表格分页代码
2016/04/12 Javascript
基于JQuery的$.ajax方法进行异步请求导致页面闪烁的解决办法
2016/05/10 Javascript
基于JavaScript实现回到页面顶部动画代码
2016/05/24 Javascript
js文件中直接alert()中文出来的是乱码的解决方法
2016/11/01 Javascript
基于vue开发的在线付费课程应用过程
2018/01/25 Javascript
JavaScript事件委托原理与用法实例分析
2018/06/07 Javascript
VeeValidate 的使用场景以及配置详解
2019/01/11 Javascript
总结4个方面优化Vue项目
2019/02/11 Javascript
详解Vue中的MVVM原理和实现方法
2020/07/15 Javascript
vuex中store存储store.commit和store.dispatch的用法
2020/07/24 Javascript
vue键盘事件点击事件加native操作
2020/07/27 Javascript
TensorFlow saver指定变量的存取
2018/03/10 Python
python使用PIL给图片添加文字生成海报示例
2018/08/17 Python
详解通过API管理或定制开发ECS实例
2018/09/30 Python
python实现的分析并统计nginx日志数据功能示例
2019/12/21 Python
Python如何定义接口和抽象类
2020/07/28 Python
python 贪心算法的实现
2020/09/18 Python
公司拓展活动方案
2014/02/13 职场文书
请假条应该怎么写?
2019/06/24 职场文书
私人贷款担保书该怎么写呢?
2019/07/02 职场文书
mybatis中sql语句CDATA标签的用法说明
2021/06/30 Java/Android
http通过StreamingHttpResponse完成连续的数据传输长链接方式
2022/02/12 Python