关于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 编程引入命名空间的方法
Jun 29 Javascript
javascript是怎么继承的介绍
Jan 05 Javascript
关于jquery ajax 调用带参数的webservice返回XML数据一个小细节
Jul 31 Javascript
js实现的切换面板实例代码
Jun 17 Javascript
JS按回车键实现登录的方法
Aug 25 Javascript
jQuery中dequeue()方法用法实例
Dec 29 Javascript
JavaScript学习总结之JS、AJAX应用
Jan 29 Javascript
JS实现的验证身份证及获取地区功能示例
Jan 16 Javascript
javascript 中Cookie读、写与删除操作
Mar 29 Javascript
Angular2学习教程之ng中变更检测问题详解
May 28 Javascript
解决vue路由name同名,路由重复的问题
Aug 05 Javascript
Vue双向数据绑定(MVVM)的原理
Oct 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
PHP中数字检测is_numeric与ctype_digit的区别介绍
2012/10/04 PHP
php将字符串全部转换成大写或者小写的方法
2015/03/17 PHP
深入理解PHP中的Streams工具
2015/07/03 PHP
php实现的AES加密类定义与用法示例
2018/01/29 PHP
JavaScript中获取元素索引的函数
2010/09/10 Javascript
IE中的File域无法清空使用jQuery重设File域
2014/04/24 Javascript
如何判断微信内置浏览器(通过User Agent实现)
2014/09/01 Javascript
Boostrap模态窗口的学习小结
2016/03/28 Javascript
AngularJS入门教程之AngularJS指令
2016/04/18 Javascript
Jquery和JS获取ul中li标签的实现方法
2016/06/02 Javascript
jquery中有哪些api jQuery主要API
2017/11/20 jQuery
一步步教会你微信小程序的登录鉴权
2018/04/09 Javascript
JS中this的指向以及call、apply的作用
2018/05/06 Javascript
vue实现form表单与table表格的数据关联功能示例
2019/01/29 Javascript
ES6知识点整理之函数数组参数的默认值及其解构应用示例
2019/04/17 Javascript
详解iframe跨域的几种常用方法(小结)
2019/04/29 Javascript
原生js基于canvas实现一个简单的前端截图工具代码实例
2019/09/10 Javascript
Vue实现腾讯云点播视频上传功能的实现代码
2020/08/17 Javascript
[02:41]DOTA2英雄基础教程 冥魂大帝
2014/01/16 DOTA
[41:21]夜魇凡尔赛茶话会 第三期02:看图识人
2021/03/11 DOTA
python检测服务器是否正常
2014/02/16 Python
在Django中限制已登录用户的访问的方法
2015/07/23 Python
关于Python中Inf与Nan的判断问题详解
2017/02/08 Python
Python爬虫爬取一个网页上的图片地址实例代码
2018/01/16 Python
python opencv判断图像是否为空的实例
2019/01/26 Python
使用python对多个txt文件中的数据进行筛选的方法
2019/07/10 Python
wxPython绘图模块wxPyPlot实现数据可视化
2019/11/19 Python
Python 过滤错误log并导出的实例
2019/12/26 Python
django中related_name的用法说明
2020/05/20 Python
师生聚会感言
2014/01/26 职场文书
保证书格式范文
2014/04/28 职场文书
2014年扶贫工作总结
2014/11/18 职场文书
学困生帮扶工作总结
2015/08/13 职场文书
2016见义勇为事迹材料汇总
2016/03/01 职场文书
旅游安全责任协议书
2016/03/22 职场文书
2019毕业论文致谢词
2019/06/24 职场文书