JavaScript 在所选文本上添加前缀 <br>

Question

我有一个textarea字段，用户可以在其中输入信息，然后将这些信息存储在用于 POST API 请求的 JS 变量中，但是由于在呈现为 HTML 时没有换行符，所有文本都在一行中。我如何能够<br>在 JavaScript 中使用 HTML 标记作为影响、采取的操作和后续步骤的前缀？当前输出：Affecting: Lorem IpsumActions Taken: Lorem IpsumNext Steps:期望的输出：<br>Affecting:<br>Actions Taken:<br>Next Steps:爱

Answer 1

在我看来你想要这样的东西：

console.log(document.getElementById('txt').value.replace(/\n/g, '<br>'))

<textarea id="txt" rows="3" cols="30">Affecting: Lorem Ipsum

Actions Taken: Lorem Ipsum

Next Steps:</textarea>

textarea-value 中返回的文本包含\n用于标记行尾的字符。在大多数 HTML 元素中，这些标记会被忽略。如果使用see here white-space格式化它们，则可以使它们在<pre>元素中甚至在“正常” <divs>s 或s 中可见。<p>white-space:pre

在我上面的代码片段中，我只是将每个替换\n为<br>.

Answer 2

标签将显示为标签的文本，而不是在文本区域中呈现，您需要换行符。

const val = 'Affecting: Lorem IpsumActions Taken: Lorem IpsumNext Steps:'.replace(/: /g, ': \n');

document.getElementById('txt').value = val;

<textarea id="txt"></textarea>