无法在文本区域内呈现HTML标记

Question

我有一个HTML文件，其中包含textarea输入元素，内容从数据库中获取，其中包括<br/>标记。

我的JSON响应是：
保密协议可以是“双向的”，意味着双方在使用所提供的材料方面都受到限制，也可以限制单方对材料的使用。<br />雇员还可以与雇主签署保密协议或类似的协议。

在渲染时，它不会换行，并将<br/>显示为静态内容。我使用了handlebars {{{content}}} 但没有帮助。

- Archana

---

你不能将HTML渲染到文本区域(textarea)中，但是你可以通过将<br>标签替换为\n或\r来强制换行。为了确保替换正确，可以使用正则表达式进行替换操作：yourString = yourString.replace(/\r?\n/g, '')。 - kosmos

你尝试过对HTML进行编码吗？比如<br>变成<br>？ - Salman A

Answer 1

您无法在文本区域中输入HTML代码，只能插入纯文本。

您可以使用可编辑的div标签（<div contenteditable="true">...</div>）。

参考：https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_Editable

- Jack

---

嗨，杰克。我尝试将contenteditable=true应用于textarea，但它不起作用。<textarea contenteditable="true"><h3>This is a paragraph. </h3></textarea> - Archana

你好，Archana。正如我之前所写的那样，你不能使用文本区域来解析HTML标签，只能使用纯文本。在我为你编写的示例中，我使用了div。 - Jack

嘿，杰克...我不想让这个div可编辑。我将其禁用并删除了textarea，取而代之的是使用了一个单独的div。如果我将contenteditable="true"，那么我想要显示的内容就可以被用户编辑，这不是我想要的。我也没有添加这个属性。现在使用一个禁用的div已经可以正常工作了。谢谢。 - Archana

那么你就不必“禁用”一个div：只需使用没有特定属性的div :) - Jack

Answer 2

如果您希望HTML被呈现，您应该使用contenteditable来实现。

- Radonirina Maminiaina

Answer 3

你可以尝试将 <br /> 替换为 /n。这样应该可以解决你的问题。

- Ankit