我让 jQuery 获取一些 textarea 内容并将其插入到 li 中。
我希望它在视觉上保留换行符。
必须有一个非常简单的方法来做到这一点......
我让 jQuery 获取一些 textarea 内容并将其插入到 li 中。
我希望它在视觉上保留换行符。
必须有一个非常简单的方法来做到这一点......
演示: http : //so.devilmaycode.it/jquery-convert-line-breaks-to-br-nl2br-equivalent
function nl2br (str, is_xhtml) {
var breakTag = (is_xhtml || typeof is_xhtml === 'undefined') ? '<br />' : '<br>';
return (str + '').replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, '$1'+ breakTag +'$2');
}
你可以简单地做:
textAreaContent=textAreaContent.replace(/\n/g,"<br>");
本着更改渲染而不是更改内容的精神,以下 CSS使每个换行符的行为类似于<br>
:
white-space: pre;
white-space: pre-line;
为什么有两条规则:pre-line
只影响换行符(感谢提供线索,@KevinPauli)。IE6-7 和其他旧浏览器退回到更极端的情况pre
,它也包含nowrap
并呈现多个空间。有关mozilla和css-tricks 中这些和其他设置 ( pre-wrap
) 的详细信息(感谢 @Sablefoste)。
虽然我通常不喜欢对问题进行二次猜测而不是回答问题,但在这种情况下,用<br>
标记替换换行符可能会增加对未经清洗的用户输入进行注入攻击的脆弱性。每当您发现自己更改了字面问题暗示必须完成的.text()
呼叫时,您就会越过一条明亮的红线.html()
。(感谢@AlexS 强调这一点。)即使您当时排除了安全风险,未来的更改也可能会在不知不觉中引入它。相反,此 CSS 允许您使用更安全的.text()
.
把它放在你的代码中(最好是在一个通用的 js 函数库中):
String.prototype.nl2br = function()
{
return this.replace(/\n/g, "<br />");
}
用法:
var myString = "test\ntest2";
myString.nl2br();
创建字符串原型函数允许您在任何字符串上使用它。
解决方案
使用此代码
jQuery.nl2br = function(varTest){
return varTest.replace(/(\r\n|\n\r|\r|\n)/g, "<br>");
};