jQuery将换行符转换为br(相当于nl2br)

Question

我正在使用jQuery获取一些textarea内容并将其插入到li中.

我希望它在视觉上保留换行符.

必须有一个非常简单的方法来做到这一点......

Answer 1

演示: 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');
}

• http://phpjs.org/functions/nl2br:480

Answer 2

你可以简单地做:

textAreaContent=textAreaContent.replace(/\n/g,"<br>");

Answer 3

把它放在你的代码中(最好是在一般的js函数库中):

String.prototype.nl2br = function()
{
    return this.replace(/\n/g, "<br />");
}

用法:

var myString = "test\ntest2";

myString.nl2br();

创建一个字符串原型函数允许你在任何字符串上使用它.

Answer 4

本着改变渲染而不是更改内容的精神,以下CSS 使每个换行符的行为如下<br>:

white-space: pre;
white-space: pre-line;

为什么有两个规则:pre-line只影响换行符(感谢线索,@ KevinPauli).IE6-7和其他旧版浏览器可以回归到更极端pre,它还包括nowrap并呈现多个空格.有关这些和其他设置(pre-wrap)的详细信息,请参阅mozilla和css-tricks(感谢@Sablefoste).

虽然我通常不喜欢SO 猜测而不是回答问题,但在这种情况下,用<br>标记替换换行可能会增加注入攻击的漏洞,而未使用的用户输入也是如此.每当你发现自己要改变字面问题所暗示的.text()调用时,你就会穿过一条鲜红色的线.html().(感谢@AlexS突出这一点.)即使您当时排除了安全风险,未来的更改也可能会无意中引入它.相反,这个CSS允许您使用更安全的方式获得没有标记的硬换行符.text().