如何在 div 中使用新行显示用户文本答案

【问题标题】：How to present user text with new lines inside a div如何在 div 中使用新行显示用户文本
【发布时间】：2015-10-21 21:39:45
【问题描述】：

我有一个bootstrap panel，其中包含用户之前插入的文本。用户文本可能包含新行。

显示这些新行的最佳方式是什么？我找到了这个answer，如果我在div 中放置一个<p> 元素，它就可以工作。另一个answer 似乎是不可能的，因为它需要替换文本，这可能会有问题。

这是最好的方法吗？它可以在主流浏览器上运行吗？

【问题讨论】：

标签： html css twitter-bootstrap newline

【解决方案1】：

我认为您可以尝试使用<pre> HTML-tag。在这种情况下，换行符将按原样显示

【讨论】：

【解决方案2】：

可能有效的jQuery解决方案

$(document).ready(function() {
  $.each($('.panel-body'), function(k, panel_body) {
    $(panel_body).html($(panel_body).text().replace(new RegExp('\r?\n','g'), '<br />'));
  });
});

【讨论】：

我试图避免文本替换，因为我很确定这种方法会破坏一些边缘情况

【解决方案3】：

我的解决方案是：

<p style="white-space: pre">user-text</p>

它似乎工作正常

【讨论】：