关于textarea中回车保存和显示

时间:2022-11-12 15:54:03

   最近做项目的时候,发现textarea文本中有敲了换行符,保存之后,点击修改按钮居然显示不了,页面报了一个非法参数,用了调试程序发现,前台获取的居然是几行数值,然后去了数据库,发现数值一行显示。于是纳闷了。或许前端框架不支持吧,此处就要自己修改了。

关于textarea中回车保存和显示

我的做法如下:

首先保存的时候java代码进行修改

note=note.replace("\n","\\r\\n")

note=note.replaceAll("\\n",<a>\\\\r\\\\n</a>)

此处使用的是java的api:replace(注意,此处强调了是java的,后面页面展示用的是js的,请对号入座),可能大家此处有疑问了,为何不用replaceAll,此处我做了一点研究,java的replaceAll和replace估计就参数不一样,比来比去也没啥好比的,如果看源码你会发现,replace函数里面仍使用replaceAll函数。


(知识补充,如果只想替换第一个,那么可以使用replaceFirst)


然后保存到数据库之后,效果是

123\r\n456\r\n789\r\n111

啊,惊讶的发现数据库居然有\r\n,\r\n在textarea中显示是换行,但是在text中或者input中会显示出来,那岂不是很难看。这个地方就需要用到了js的replace方法(注:js木有replaceAll方法),如果需要替换很多,看来只能用正则表达式了。

content = "<td id='remark_td'><span title='" +((model.remark==null)?"":model.remark.replace(/\\r\\n/g,''))+ "'>" + ((model.remark==null)?"":model.remark.replace(/\\r\\n/g,'')+ "</span></td>" 

 


代码写完,效果如下

关于textarea中回车保存和显示关于textarea中回车保存和显示

点击修改按钮,弹出textarea框,并把数据库的值显示出来。我们发现,自动换行了,目标达到了。

关于textarea中回车保存和显示

到这就结束了,当然还有别的方法,比如把回车替换成特殊字符。然后进行处理