textarea显⽰多出⼀段空格的原因
HTML中标签<textarea>内指定输⼊⼀段⽂本,content的字数以及⽂本框显⽰⾏列数可以通过maxlength,rows,cols属性来定义,⽽在我们提供给浏览器进⾏显⽰时,我相信有朋友会发现有时候显⽰出来的内容会莫名其妙的多出⼀段空格,导致显⽰效果不满意。
其实原因很简单,如果我们使⽤如下⼀段代码时:
textarea中cols表示在浏览器进⾏显⽰时,<textarea>……</texterea>之间的⽂字、换⾏和空格等都会被当作textarea的值显⽰。但是,在textarea⾥⾯的回车字符是"\r",HTML的回车字符是"<br/>",textarea中输⼊的空格是空⽩" ",⽽html中的⼀个空格是" "。所以会导致浏览器显⽰如下的异常效果。
此时我们只需消除<textarea>……</textarea>之间多余的空格和换⾏就可以了
显⽰效果
除此之外,很多时候textarea content不是我们⾃⼰写在HTML代码中的,⽽是通过后台数据传递到HTML或者js加载到其中,为正常显⽰textarea content所有的空格,换⾏,除了上述简单⽅法之外,我们可以⽤以下⽅法实现:
"textarea content".replaceAll(" "," ").replaceAll("\r","<br/>");
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论