关于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 相关文章推荐
top.location.href 没有权限 解决方法
Aug 05 Javascript
setTimeout和setInterval的区别你真的了解吗?
Mar 31 Javascript
JavaScript中访问节点对象的方法有哪些如何使用
Sep 24 Javascript
js脚本获取webform服务器控件的方法
May 16 Javascript
深入理解JavaScript系列(34):设计模式之命令模式详解
Mar 03 Javascript
jQuery插件slicebox实现3D动画图片轮播切换特效
Apr 12 Javascript
JavaScript实现水平进度条拖拽效果
Jan 18 Javascript
几行js代码实现自适应
Feb 24 Javascript
JavaScript自执行函数和jQuery扩展方法详解
Oct 27 jQuery
如何给element添加一个抽屉组件的方法步骤
Jul 14 Javascript
vue柱状进度条图像的完美实现方案
Aug 26 Javascript
vue 解决data中定义图片相对路径页面不显示的问题
Aug 13 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连接mssql:pdo odbc sql server
2011/07/20 PHP
php实现在线生成条形码示例分享(条形码生成器)
2013/12/30 PHP
ThinkPHP的L方法使用简介
2014/06/18 PHP
PHP+MySQL统计该库中每个表的记录数并按递减顺序排列的方法
2016/02/15 PHP
ThinkPHP框架获取最后一次执行SQL语句及变量调试简单操作示例
2018/06/13 PHP
js判断变量是否空值的代码
2008/10/26 Javascript
jQuery aminate方法定位到页面具体位置
2013/12/26 Javascript
每日十条JavaScript经验技巧(二)
2016/06/23 Javascript
jQuery EasyUI封装简化操作
2016/09/18 Javascript
详解AngularJS验证、过滤器、指令
2017/01/04 Javascript
Vue CLI3搭建的项目中路径相关问题的解决
2018/09/17 Javascript
Vue2.0学习系列之项目上线的方法步骤(图文)
2018/09/25 Javascript
微信小程序如何实现五星评价功能
2019/10/15 Javascript
Javascript如何实现扩充基本类型
2020/08/26 Javascript
使用Mock.js生成前端测试数据
2020/12/13 Javascript
Python编写屏幕截图程序方法
2015/02/18 Python
python实现爬虫统计学校BBS男女比例(一)
2015/12/31 Python
Python爬取三国演义的实现方法
2016/09/12 Python
Python for循环与range函数的使用详解
2019/03/23 Python
如何使用Python标准库进行性能测试
2019/06/25 Python
Python3内置模块之base64编解码方法详解
2019/07/13 Python
python 环境搭建 及python-3.4.4的下载和安装过程
2019/07/20 Python
Python中的self用法详解
2019/08/06 Python
Django 自定义权限管理系统详解(通过中间件认证)
2020/03/11 Python
2020新版本pycharm+anaconda+opencv+pyqt环境配置学习笔记,亲测可用
2020/03/24 Python
德国体育用品网上商店:SC24.com
2016/08/01 全球购物
SmartBuyGlasses丹麦:网上购买名牌太阳镜、眼镜和隐形眼镜
2016/10/01 全球购物
德国最大的婴儿用品网上商店:Kidsroom.de(支持中文)
2020/09/02 全球购物
Ruby如何实现动态方法调用
2012/11/18 面试题
端午节活动策划方案
2014/03/09 职场文书
教师四风对照检查材料思想汇报
2014/09/17 职场文书
法制工作总结2015
2015/07/23 职场文书
职工食堂管理制度
2015/08/06 职场文书
中学图书馆工作总结
2015/08/11 职场文书
python第三方网页解析器 lxml 扩展库与 xpath 的使用方法
2021/04/06 Python
React中的Context应用场景分析
2021/06/11 Javascript