如何在 HTML 表单元素中集成“内容可编辑”功能？

Question

我想使用 Aloha HTML5 RTE 作为表单元素。 http://aloha-editor.org/index.php

最终归结为“ContentEditable”属性。 通常应用为

<section contenteditable="true" id="editable">
<h2>Go ahead, edit away!</h2>
<p>Here's a typical paragraph element</p>
<ol>
<li>and now a list</li>
<li>with only</li>
<li>three items</li>
</ol>
</section>

我希望表单元素具有类似的功能，因此我可以将格式化的 HTML 作为表单名称/值对发送到服务器端。

可行吗？怎么样？

Answer 1

我前段时间写了一篇关于如何在 textareas 上使用 Aloha Editor 的博客文章：http://www.supnig.com/blog/using-aloha-editor

像 Aloha 编辑器这样的所见即所得编辑器不仅仅是 contenteditable=true，它可以解决各种奇怪的浏览器行为，并添加功能来正确格式化您的内容。

如果您不想使用 Aloha 编辑器，您必须监听表单上的提交事件并获取 contenteditable 元素的内容并将其注入到发送的数据中。