在 jQuery / JavaScript 的每一行末尾添加 <br /> 标签

Question

我有一个<textarea>用于用户输入的字段。我想要这个 - 当用户将他们的文本粘贴到该字段中并单击某个按钮时，它会<br />在每行末尾自动添加一个换行标记。
我的 html 表单看起来像这样。

<div class="comment">
    <textarea class="form-control page_details" rows="5" id="text" placeholder="Detail here" name="details"></textarea>
    <button type="button">Generate</button>
</div>

当用户将他们的文本粘贴到 textarea 字段时。

Lorem ipsum dolor sat amet,
consectetuer adipiscing elit,
sed diam nonummy nibh euismod tincidunt
ut laoreet dolore magna aliquam
erat volutpat。

单击按钮时，它看起来像这样。

Lorem ipsum dolor sat amet，<br />
consectetuer adipiscing elit，<br />
sed diam nonummy nibh euismod tincidunt <br />
ut laoreet dolore magna aliquam<br />
erat volutpat。<br />

帮帮我吧伙计们。

Answer 1

您可以使用String.protototype.split()with RegExp /\n|\s\n/, Array.prototype.join()with parameter "<br>\n", 连接"<br>"到替换结束textarea value

function addBreak(el) {
  var textarea = el;
  var matches = textarea.value.split(/\n|\s\n/);
  textarea.value = matches.join("<br>\n") + "<br>";
}

<div class="comment">
  <textarea class="form-control page_details" rows="5" id="text" placeholder="Detail here" name="details"></textarea>
  <button type="button" onclick="addBreak(this.previousElementSibling)">Generate</button>
</div>