jQuery - 获取包含 HTML 标签的文本区域的值答案

【问题标题】：jQuery - Get value of textarea that contains HTML tagsjQuery - 获取包含 HTML 标签的文本区域的值
【发布时间】：2014-10-14 17:52:15
【问题描述】：

编辑：

使用$.text() 可以正常工作，问题出在其他地方。我不会删除该问题以供将来参考，以防有人遇到 - 看似 - 相同的问题。另请查看已接受的解决方案答案。

我正在开发一个富文本编辑器，它从textarea 读取内容并使用该内容创建一个可编辑的div。

问题是我似乎无法从 textarea 中获取 HTML 标签，只能获取纯文本。

HTML 代码

<textarea id="rtf-1">
    <h2>Big monster&nbsp;</h2><p>Kosova long crowing rooster test.</p>
</textarea>

Javascript 代码

var html = $('#rtf-1').html();

不知道为什么，但var html 总是'大怪物科索瓦长鸣公鸡测试'，标签在此过程中的某个地方被暗杀。当我尝试使用$.text() 或$.val() 时也会发生同样的情况。

我需要 var html 成为 <h2>Big monster&nbsp;</h2><p>Kosova long crowing rooster test.</p>。关于如何做到这一点的任何建议？

感谢您阅读我的回答。除了从 textarea 内容（值）本身之外，我不是在寻找初始化富文本编辑器的替代方法，而且我当然不是在寻找现有的 RTF 编辑器，如 TinyMCE。如果可以，请回答上面的问题。

【问题讨论】：

也许改用.text()？它将提取文本本身（标签和所有），然后您可以.parseHTML() 再次获取 HTML 值。类似var html = $.parseHTML($('#rtf-1').text());
@PlantTheIdea 那不是更像var domNodes = $.parseHTML(...) 吗？ $.parseHTML 接受一个 HTML 字符串（而不是返回一个）。
感谢您的帮助，事实证明，代码在 .text() 上运行良好，但问题在于将 textarea 元素与其对应的 divs 相关联

【解决方案1】：

textarea 元素实际上并不包含 HTML，因此要获得表示 HTML 的字符串的等价物，您需要使用 .text()。例如，

$('#render-to-me').html($('#rtf-1').text());

这里有一个 JSFiddle 来演示：http://jsfiddle.net/44xjew92/

【讨论】：

感谢您的回答，但事实证明，问题在于将给定的textarea 与其对应的div 相关联。
那里的“关联”是什么意思？
为富文本编辑创建的 div 被分配了一个生成但唯一的 ID rtf-editor-#。 textarea 的 data-rtf-editor 属性等于新 div 的 id。为了能够在表单中使用文本区域，事件处理程序rtfchange 也绑定到新的div，它更新...好吧，现在关联textarea 内容。这种关联是问题的根源。