关于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 陷阱 window全局对象
Nov 26 Javascript
一次$.getJSON不执行的简单记录
Jul 19 Javascript
vue v-model表单控件绑定详解
May 17 Javascript
[js高手之路]从原型链开始图解继承到组合继承的产生详解
Aug 28 Javascript
ui-router中使用ocLazyLoad和resolve的具体方法
Oct 18 Javascript
Vue.js实现分页查询功能
Nov 15 Javascript
vue实现某元素吸顶或固定位置显示(监听滚动事件)
Dec 13 Javascript
jQuery实现的下雪动画效果示例【附源码下载】
Feb 02 jQuery
快速解决brew安装特定版本flow的问题
May 17 Javascript
jQuery中each和js中forEach的区别分析
Feb 27 jQuery
基于Vue 实现一个中规中矩loading组件
Apr 03 Javascript
Js通过AES加密后PHP用Openssl解密的方法
Jul 12 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留言本实例代码
2010/05/09 PHP
简单的PHP缓存设计实现代码
2011/09/30 PHP
php中smarty模板条件判断用法实例
2015/06/11 PHP
namespace.js Javascript的命名空间库
2011/10/11 Javascript
Javascript中的isNaN函数使用说明
2011/11/10 Javascript
js页面跳转的常用方法整理
2013/10/18 Javascript
jQuery 滑动方法slideDown向下滑动元素
2014/01/16 Javascript
vuejs2.0子组件改变父组件的数据实例
2017/05/10 Javascript
SpringMVC简单整合Angular2的示例
2017/07/31 Javascript
浅谈ajax在jquery中的请求和servlet中的响应
2018/01/22 jQuery
webpack 样式加载的实现原理
2018/06/12 Javascript
JS实现获取毫秒值及转换成年月日时分秒的方法
2018/08/15 Javascript
JavaScript时间与时间戳的转换操作实例分析
2018/12/07 Javascript
小程序文字跑马灯效果
2018/12/28 Javascript
Python获取央视节目单的实现代码
2015/07/25 Python
在DigitalOcean的服务器上部署flaskblog应用
2015/12/19 Python
Python入门之三角函数全解【收藏】
2017/11/08 Python
tensorflow训练中出现nan问题的解决
2018/02/10 Python
对python中的logger模块全面讲解
2018/04/28 Python
python更改已存在excel文件的方法
2018/05/03 Python
python实现简单的单变量线性回归方法
2018/11/08 Python
详解Python3中ceil()函数用法
2019/02/19 Python
python实现登录密码重置简易操作代码
2019/08/14 Python
Python scrapy增量爬取实例及实现过程解析
2019/12/24 Python
Python3操作读写CSV文件使用包过程解析
2020/04/10 Python
python使用多线程+socket实现端口扫描
2020/05/28 Python
CSS3中引入多种自定义字体font-face
2020/06/12 HTML / CSS
丝芙兰法国官网:SEPHORA法国
2016/09/01 全球购物
企业党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
出纳工作检讨书
2014/10/18 职场文书
英文自荐信范文
2015/03/25 职场文书
七一表彰大会简报
2015/07/20 职场文书
实用干货:敬酒词大全,帮你应付各种场合
2019/11/21 职场文书
Python中os模块的简单使用及重命名操作
2021/04/17 Python
详解Python函数print用法
2021/06/18 Python
vue.js 使用原生js实现轮播图
2022/04/26 Vue.js