在文本区域中保留换行

Question

我正在寻找从textare创建电子邮件模板，该模板可以显示在div中，也可以通过mailto发送。 这是一个jsFiddle 。

HTML非常简单：

<textarea id="TheTextInput" rows="5"></textarea>
<input type="button" id="TheButton" value="click" />
<div id="TheOutput"></div>

我目前正在尝试的JavaScript如下所示：

$(document).ready(function () {
    $('#TheButton').click(PutTextIntoDiv);
});

function PutTextIntoDiv() {
    var TheText = encodeURIComponent($('#TheTextInput').val());
    $('#TheOutput').text(TheText);
}

这是现在的输出：

如您所见，由于未保留换行符，因此编码和解码不起作用。 我需要更改什么？

Answer 1

好吧，我想您需要使用decodeURIComponent()对字符串进行解码

function PutTextIntoDiv() {
    var TheText = encodeURIComponent($('#TheTextInput').val());
    $('#TheOutput').text(decodeURIComponent(TheText));
}

并将<div>替换为HTML中的<pre> ：

<pre id="TheOutput"></pre>

如果您要具有显式<br>标记（或其他任何标记），则可以使用另一种选择：

var brText = TheText.replace(/%0A/g,"<br/>");