html - 如何为 Textarea 启用 HTML？

Question

如何为 textareas 启用 HTML？我需要获得某种文本编辑器还是可以启用它？我需要这方面的帮助。我正在制作用户编写的游戏演练，他们希望启用 HTML，以便他们可以添加图像、视频等。

那么，我该怎么做？

Answer 1

你以错误的方式解决这个问题。输入 a 时textarea，输入的信息实际上只是字符串。我可以输入以下内容：

<h1>Hello, World!</h1> Here is some text <br/> Here is some more <ul><li>This is a list</li></ul>

但是浏览器将其视为简单的字符序列，就像您只需键入以下内容一样：

The quick brown fox jumps over the lazy dog.

如果您尝试将手写的 HTML 解析并显示为代码，那么您需要使用一些 Javascript 来读取文本的内容并将其放入一个空的div或其他一些旨在填充的元素中，code而不是text.

一个 jQuery 的例子：

<textarea id="inputBox">
    type some HTML inside me
</textarea>
<div id="resultsBox"></div>

<script>
$('#inputBox').on('input',function() {
    $('#resultsBox').html($('#inputBox').val());
});
</script>

此代码侦听用户何时在 中键入textarea内容并将该数据作为 HTML插入到div.

关键是，如果不以某种方式将文本加载到非文本输入元素中，就不能将文本区域中的文本“转换为”HTML。在您这样做之前，输入的数据只是一个字符串。

请注意，即使是无效和未完成的 HTML，也会在此示例中插入。