javascript - js 将\n 替换为 并显示

Question

我有用于输入的 textarea 和用于显示输入的 show-div:

<textarea id="inputtext" style="height:100px"></textarea>

<button id="show">show in div</button>

<div id="showtext">

</div>

和我的js:

$(function(){
 $('#show').on('click',function(){
    var text = $.trim($('#inputtext').val());
    text = text.replace(/\r?\n/g, "<br />").replace(/<br\s*[\/]?>/gi, "\n");
    $('#showtext').text(text);
 });
});

我想要的是，如果你给:
一个
b
c

它也应该以这种形式显示。但它现在显示:a b c。

这是我的 fiddle :http://jsfiddle.net/5gkak/

我做错了什么？

Answer 1

你需要改变你的 fiddle 来匹配这个:http://jsfiddle.net/5gkak/1/

$(function(){
    $('#show').on('click',function(){
        var text = $.trim($('#inputtext').val());
        text = text.replace(/\r?\n/g, "<br />");
        $('#showtext').html(text);
    });
});

您所拥有的是替换 \n与 <br />然后反过来做同样的事情 <br />正在被 \n 取代.您还需要设置 #showtext 的 html .查看 .text 的区别和 .html 在 jQuery 文档中。

还有其他选项(这些来自问题的评论部分):

• 纯 CSS(用于格式化):http://jsfiddle.net/5gkak/2/ (这是 IMO 最酷的解决方案)
• 仅限 Html(用于格式化):http://jsfiddle.net/5gkak/3/ (这个不适用于所有文本!)