解决textarea有换行时的数据存库及赋值问题

原创 2017年05月22日 16:53:10

解决此问题前,先要知道textarea里的换行标记是 \n。这是我用一个笨办法测试的结果,所用浏览器为火狐和IE11,数据库为mysql。

<textarea placeholder="详情描述要求" id="description"></textarea>

测试办法如下:

    var d = $('#description').val();

    alert(d.split('\n')+'******'+d.split('\r'));   //根据数字判断出换行标记为\n

如果不进行任何处理,textarea的值是可以直接存库的,而且数据库中是不会显示\n这个换行标记的,但是在给页面赋值时,不管用 $('#description').val(从数据库中查出的值)还是$('#description').text(从数据库中查出的值),浏览器都会报错。

    假设从数据库中查出的值为‘测试换行(此处有换行)第二行’,赋值方法为.val(),那么浏览器这样报错:

      $('#description').val('测试换行

          第二行');       报错意思是字符串没有正确结束,这是因为换行在赋值时生效了,所以你的赋值语句为2行,所以会报错。


在网上搜了半天没找到解决办法,我自己想了一个,办法如下:

     在取值存库之前,做此处理:info.desc=$('#description').val().replace(/\n/g,'<br>');  把\n替换为普通字符串<br>,这个普通字符串是随意的,我这里用的是<br>,只是在输入内容时不能输入这个字符串,否则会对结果有影响。替换完之后再往数据库存,这时数据库中的值为:测试换行<br>第二行。

     给页面赋值时,你可以在sql中就把这个字符串<br>替换为‘\n’,也可以在页面通过js把<br>替换为‘\n’,替换之后,再用.val()或.text()赋值,此时不会报错,页面显示正常。


这个方法是我无意中试出来的,可能不太好,还有缺陷,因刚毕业不久,道行太浅,其中的原理我尚且不知,为何会报错及为何这样处理后就不报错我也说不清楚,总之在我的项目中目的是达到了,页面可以正常访问。

如果你有更好的方法或者知道这其中的原委,欢迎留言讨论,期待与你共进步!


版权声明:本文为博主原创文章,未经博主允许不得转载。

Textarea换行输出到前端无效果的推荐处理方法

在处理一些长文本的时候(仅是较长的纯字符串,还不用大动干戈使用富文本编辑器)经常会用到Textarea标签作为输入控件。Textarea作为一个输入控件有许多优点: 通过CSS可以方便地调节输入框的长...
  • u012939070
  • u012939070
  • 2016年01月17日 11:51
  • 2881

处理textarea的空格和换行

刚发了一篇博客,然后发现csdn在发布用户的文章时好像没有处理输入的换行和空格,之前没有很在意,因为这次我辛苦缩进的代码居然显示一团糟,有点接受不了,鉴于最近做的需求遇到了这个问题,所以说一下这个问题...
  • THEANARKH
  • THEANARKH
  • 2016年05月28日 01:39
  • 8891

textarea文字换行保存到数据后读出来没有换行 解决方案

textarea文字换行保存到数据后读出来没有换行 解决方案
  • u012726702
  • u012726702
  • 2016年06月27日 21:18
  • 9919

textarea对象换行问题(强制换行、自动换行)

为大家介绍html中textarea对象的换行问题,强制换行、自动换行,有需要的朋友可以参考下。 将以下样式加到显示的table标签中,会按照表格的大小强制换行: style= "table-la...
  • u014457793
  • u014457793
  • 2014年04月20日 14:43
  • 2666

常见textarea换行问题的处理方法

textarea换行时主要遇到的有以下两个问题 1、在textarea中输入回车符 在js读取textarea中的值有\r\n然后到业务层转换到string中就有可能变成空格形式然后被存入数据库...
  • jkpi888
  • jkpi888
  • 2013年11月24日 10:15
  • 3555

怎么正确显示textarea内容的换行

相信不少人都碰到过这个问题:网页中提交评论之类的,评论文字全长也就几十个字而已,用富文本编辑器有点夸张,所以用textarea实现,但评论的内容存到数据库,再读出来显示在网页上,评论的换行不见了,所有...
  • liyongxxyy
  • liyongxxyy
  • 2016年02月19日 15:34
  • 1750

textarea里显示换行<br>

textarea换行 在easyui中的datagrid中使用行内编辑时textarea的换行保存到mysql数据库为\n 在textarea中输入回车符 在js读取textarea中的值...
  • youyou_yo
  • youyou_yo
  • 2016年08月25日 09:10
  • 4701

Jquery实现textarea自动换行

今天做一个在线聊天小程序的时候,利用jquery把文本框中的内容放入文本域,发现嵌入Html代码没有反应,这是去网上查查没 找到答案,不过看到了这样一句话: jQuery的text()和val()...
  • wangnetkang
  • wangnetkang
  • 2012年07月05日 15:40
  • 14933

JQuery给textarea取值和赋值

JQuery给textarea取值和赋值
  • bestcxx
  • bestcxx
  • 2016年02月24日 17:12
  • 50217

easyui textarea 赋值和获取值

获取值: $("#NewsIntro").val()
  • yelin042
  • yelin042
  • 2017年06月25日 15:34
  • 2522
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:解决textarea有换行时的数据存库及赋值问题
举报原因:
原因补充:

(最多只允许输入30个字)