jQuery convert line breaks to br (nl2br equivalent)

你可以简单地做:

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

Demo: < a href = “ http://so.devilmaycode.it/jquery-turn-line-break-to-br-nl2br-equals”rel = “ norefrer”> 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

把它放在代码中(最好放在一个通用的 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>");
};

In the spirit of changing the 渲染 instead of changing the 内容, the following CSS makes each newline behave like a <br>:

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

为什么有两条规则: pre-line只影响换行(感谢提示,@KevinPauli)。IE6-7和其他老式浏览器退回到更极端的 pre，也包括 nowrap和呈现多个空间。有关这些和其他设置(pre-wrap)的详细信息，请访问 Mozilla和 CSS 把戏(感谢@Sablefoste)。

虽然我一般反对 S.O 对 second-guessing the question的偏好，而不是回答它，但在这种情况下，用 <br>标记替换换行可能会增加未清洗用户输入对 注射攻击的脆弱性。当您发现自己将 .text()调用更改为 .html()时，您就越过了一条明显的红线，而字面上的问题意味着必须这样做。(谢谢@AlexS 强调这一点。)即使当时排除了安全风险，未来的更改也可能在不知不觉中引入安全风险。相反，这个 CSS 允许您使用更安全的 .text()在不使用标记的情况下得到强制换行。

to improve @Luca Filosofi's accepted answer,

如果需要，将这个正则表达式的开始子句更改为 /([^>[\s]?\r\n]?)也将忽略换行在标记和一些空格之后的情况，而不仅仅是立即跟在换行后面的标记

在 DOM 中保持换行符的文本区插入文本的另一种方法是使用表示节点及其后代的 呈现文本内容的 Node.innerText属性。

作为一个 getter，如果用户使用光标突出显示元素的内容，然后将其复制到剪贴板，那么它将近似于用户将获得的文本。

该属性在2016年成为标准，并得到了现代浏览器的良好支持。当我发布这个答案时，97% 的全球覆盖率。

这个 JavaScript 函数考虑是使用 insert 还是 place 来处理交换。

(插入或替换 HTML 换行符)

/**
* This function is same as PHP's nl2br() with default parameters.
*
* @param {string} str Input text
* @param {boolean} replaceMode Use replace instead of insert
* @param {boolean} isXhtml Use XHTML
* @return {string} Filtered text
*/
function nl2br (str, replaceMode, isXhtml) {


var breakTag = (isXhtml) ? '<br />' : '<br>';
var replaceStr = (replaceMode) ? '$1'+ breakTag : '$1'+ breakTag +'$2';
return (str + '').replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, replaceStr);
}

Demo-JSFiddle

JavaScript nl2br & br2nl 函数

我为此编写了一个小小的 jQuery 扩展:

$.fn.nl2brText = function (sText) {
var bReturnValue = 'undefined' == typeof sText;
if(bReturnValue) {
sText = $('<pre>').html(this.html().replace(/<br[^>]*>/i, '\n')).text();
}
var aElms = [];
sText.split(/\r\n|\r|\n/).forEach(function(sSubstring) {
if(aElms.length) {
aElms.push(document.createElement('br'));
}
aElms.push(document.createTextNode(sSubstring));
});
var $aElms = $(aElms);
if(bReturnValue) {
return $aElms;
}
return this.empty().append($aElms);
};