文本区域内容可编辑答案

【问题标题】：Textarea contenteditable文本区域内容可编辑
【发布时间】：2009-10-14 14:56:45
【问题描述】：

我正在尝试使 textarea 内容可编辑，但我失败了。我正在使用此代码：

<textarea id='' class='' name='notes' rows='12' cols='67' contenteditable='true' ></textarea>

我期待像http://html5demos.com/contenteditable这样的结果

有人知道为什么它不起作用吗？

编辑：

我这样做是因为我正在尝试做一个单行器来向表单添加一个控件，在该表单中可以粘贴 (HTML) 格式的内容并保留其格式。我试图做到这一点没有大惊小怪，也没有 javascript 代码。看来这是不可能的。如果没有进一步的相反意见，我将在一天内结束这个问题。

【问题讨论】：

标签： html textarea contenteditable

【解决方案1】：

您是否在页面顶部设置了正确的文档类型？对于 HTML5，您需要以下文档类型：

<!DOCTYPE html>

另外，为什么是文本区域？ textareas 已经可以编辑了。

【讨论】：

在 Ben 的帖子中，我希望有一个所见即所得的方式，可以粘贴粗体文本等并保留格式。这样做的原因是我需要在编辑后将其发布到表单提交中。
表单不会提交格式。而是将其放在一个 div 中并使用 onSumbit 读取该 div 的 innerHTML。
谢谢马吕斯。我希望亲吻，但我们走了。

【解决方案2】：

他们没有使用文本区域，文本区域已经是可编辑的。这就是他们正在使用的

<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>

【讨论】：

我希望有一个所见即所得，可以粘贴粗体文本等。原因是我需要在编辑后将其发布在表单中。
我也需要这样的东西。我看到有些人实际上将其内容写入隐藏字段，但是每次进行更改或运行 execCommand 时都必须进行此更新
但部分或其他类似对象不支持占位符、必需等原生功能。textarea 不支持可编辑为 html 格式的内容。

【解决方案3】：

我不想重复任何事情，但我已经制作了一个演示来展示正在发生的事情。

http://gist.github.com/210327

只需运行它，编辑您想要的内容，然后单击“输出格式化内容”语句以接收警报消息，其中包含 contenteditable 元素中实际 html 格式内容的输出。至于添加格式等，您需要在突出显示的任何内容上制作调用文本修改功能的按钮。是的，那部分会很有趣。

不过，我希望这会有所帮助。

【讨论】：

努力+1，但这不是我所需要的......因为我认为我需要的东西是不可能的。

【解决方案4】：

鉴于您的评论回复，我会推荐任何优秀的 WYSIWYG 编辑器。无需重新发明轮子，我认为contenteditable 无论如何也无法满足您的需求。

我个人最喜欢的是CKEditor，但还有很多很多其他的。 TinyMCE也很受欢迎。

【讨论】：

我希望有一个 oneliner 来解决我的问题（只需要一个可以保存格式化文本的简单文本区域）但这显然不在卡片上。不过感谢您的建议。