关于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 相关文章推荐
jQuery第三课 修改元素属性及内容的代码
Mar 14 Javascript
jQuery初学:find()方法及children方法的区别分析
Jan 31 Javascript
jquery动态加载js三种方法实例
Aug 03 Javascript
jQuery实现响应浏览器缩放大小并改变背景颜色
Oct 31 Javascript
JavaScript事件委托实例分析
May 26 Javascript
无缝滚动的简单实现代码(推荐)
Jun 07 Javascript
vue.js初学入门教程(1)
Nov 03 Javascript
vue里面父组件修改子组件样式的方法
Feb 03 Javascript
微信小程序websocket实现聊天功能
Mar 30 Javascript
vue生成token并保存到本地存储中
Jul 17 Javascript
vue自定义switch开关组件,实现样式可自行更改
Nov 01 Javascript
vue+Element中table表格实现可编辑(select下拉框)
May 21 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
图书管理程序(二)
2006/10/09 PHP
php将字符串转化成date存入数据库的两种方式
2014/04/28 PHP
php实现微信企业转账功能
2018/10/02 PHP
PHP cookie与session会话基本用法实例分析
2019/11/18 PHP
浅析js中2个等号与3个等号的区别
2013/08/06 Javascript
jquery实现metro效果示例代码
2013/09/06 Javascript
jquery解析xml字符串简单示例
2014/04/11 Javascript
5个书写JavaScript代码的坏习惯,看看你中枪了没?
2014/11/06 Javascript
javascript等号运算符使用详解
2015/04/16 Javascript
JS实现自动切换文字的导航效果代码
2015/08/27 Javascript
详解Vue学习笔记入门篇之组件的内容分发(slot)
2017/07/17 Javascript
深入理解Vue.js源码之事件机制
2017/09/27 Javascript
浅谈对于react-thunk中间件的简单理解
2019/05/01 Javascript
[06:53]2018DOTA2国际邀请赛寻真——为复仇而来的Newbee
2018/08/15 DOTA
python模拟新浪微博登陆功能(新浪微博爬虫)
2013/12/24 Python
python计数排序和基数排序算法实例
2014/04/25 Python
python读取word文档的方法
2015/05/09 Python
单链表反转python实现代码示例
2018/02/08 Python
python 接口测试response返回数据对比的方法
2018/02/11 Python
Python读写docx文件的方法
2018/05/08 Python
利用Pandas读取文件路径或文件名称包含中文的csv文件方法
2018/07/04 Python
python实现图片彩色转化为素描
2019/01/15 Python
Python中format()格式输出全解
2019/04/12 Python
python实现布隆过滤器及原理解析
2019/12/08 Python
Pytorch使用MNIST数据集实现基础GAN和DCGAN详解
2020/01/10 Python
python序列类型种类详解
2020/02/26 Python
Tensorflow tf.tile()的用法实例分析
2020/05/22 Python
美体小铺印度官网:The Body Shop印度
2019/10/17 全球购物
Shell脚本如何向终端输出信息
2014/04/25 面试题
竞聘演讲稿范文
2014/01/12 职场文书
办护照工作证明
2014/10/01 职场文书
2014年计划生育协会工作总结
2014/11/14 职场文书
优秀班主任主要事迹材料
2014/12/16 职场文书
2015少先队大队辅导员工作总结
2015/07/24 职场文书
MySql分区类型及创建分区的方法
2022/04/13 MySQL
Python+pyaudio实现音频控制示例详解
2022/07/23 Python