Html 文本区域内容可编辑

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/1566859/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 01:02:50  来源:igfitidea点击:

Textarea contenteditable

htmltextareacontenteditable

提问by Antony Carthy

I am trying to make a textarea content editable and I am failing. I am using this code:

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

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

I am expecting a result like http://html5demos.com/contenteditable

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

Does anyone have an idea why it's not working?

有谁知道为什么它不起作用?

Edit:

编辑:

I am doing this because I am trying to do a oneliner to add a control to a form in which (HTML) formatted content can be pasted and retain its formatting. I am trying to do this without fuss and without javascript code. It appears this is not possible. I will close this question in a day if no further input to the contrary is added.

我这样做是因为我正在尝试做一个oneliner来将一个控件添加到一个可以粘贴(HTML)格式内容并保留其格式的表单中。我正在努力做到这一点,没有大惊小怪,没有 javascript 代码。看来这是不可能的。如果没有进一步的相反输入,我将在一天内关闭这个问题。

回答by Marius

Have you set the right doctype at the top of your page? For HTML5 you need the following doctype:

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

<!DOCTYPE html>

Also, why a textarea? textareas are already editable.

另外,为什么是文本区域?textareas 已经是可编辑的。

回答by Ben Shelock

They are not using a textarea, textareas are already editable. This is what they are using

他们没有使用 textarea,textareas 已经是可编辑的。这是他们正在使用的

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

回答by slant

I don't mean to repeat anything, but I've put together a demo that shows what is happening.

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

http://gist.github.com/210327

http://gist.github.com/210327

Just run that, edit what you wish and click the 'Output Formatted Content' statement to receive an alert message with an output of the actual html-formatted content in the contenteditable element. As for adding formatting, etc, you'll need to make buttons that call a text-modifying function on whatever is highlighted. Yeah, that part will be fun.

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

Nonetheless, I hope this helps.

尽管如此,我希望这会有所帮助。

回答by anschauung

Given your comment responses, I would recommend any of the excellent WYSIWYG editors out there. No need to re-invent the wheel, and I don't think contenteditablewouldn't have met your needs anyway.

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

My personal favorite is CKEditor, but there are many, many others. TinyMCEis also very popular.

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