WYSIWYG编辑器在div上使用contenteditable有多可靠？

我相信这个标题不言而喻，但也许，我应该详细询问。我正在构建一个所见即所得的编辑器，而且我真的处于开始阶段。所以，我意识到也许知道利弊会启发我。基本上，我的问题是，因为我想要一个在所有主流浏览器中至少可以工作90％的编辑器，我可以如何进一步使用div中的contenteditable，以及与designMode和iframe相比，使用contenteditable有哪些缺点和优点？另外，在研究中我发现了this editor。我相信它没有使用任何这些属性，它正在移动textarea的位置。这是一个更好的方法吗？那么，我知道有很多因素会影响最后一个问题的答案，但正如我所提到的，我在编辑器中查找的最重要的事情是它可以被90％的用户使用。注意：我不想使用任何第三方库。WYSIWYG编辑器在div上使用contenteditable有多可靠？

来源

2011-04-16 Shaokan

您提到的编辑器不是一个所见即所得的编辑器，只是一个纯文本编辑器，高亮显示 – user123444555621 2011-04-16 13:11:50

对于大多数用途，我的首选仍然是在大多数浏览器上使用designMode的iframe，并且在IE中使用可用的<body>元素，这使得它更易于使用。原因：

具有可编辑内容的iframe有效沙箱，并可以丢弃编辑器到任何网页与信心，页面的CSS和DOM事件不会影响到编辑内容
designMode更可靠在Firefox中。我见过几个bug与contenteditable不与designMode存在，这可能是因为CONTENTEDITABLE加入到Firefox相对较近，而将designMode自2003年以来各地

至于ACE存在，它的textarea的做法是聪明并有很多优点，但我怀疑这种方法仅限于等宽字体。另外，CodeMirror 2 uses a related approach但同样限于等宽字体。

来源

2011-04-16 11:09:15

谢谢蒂姆。坚持使用contentEditable的唯一事情是我不喜欢使用iframe。可能是因为之前几年我在这个标签上做过的阅读。或者可能是一个误会。我相信使用div比iframe更有效。这只是一个信念寿，我没有做出研究:)至于FF，我知道contenteditable在firefox 2中不被支持，但在做了一些研究后，我发现ff2甚至没有1％的份额主要浏览器。那么，您是否认为使用contentEditable可以使用一个好的所见即所得的编辑器（至少90％的用户是有针对性的）？ – Shaokan 2011-04-16 12:03:22

@ Shaokan：是的，我认为contenteditable是可以使用的。尽管iframe没有任何失效，并且至少有两个主要的所见即所得编辑器（TinyMCE和CKEditor）使用它们。 – 2011-04-19 10:30:51

再次感谢蒂姆:) – Shaokan 2011-04-19 10:34:48

的designMode和contentEditable的属性，以及推动富文本编辑器中的API，在所有主要浏览器，包括Firefox，歌剧，Safari浏览器，谷歌Chrome，当然还有Internet Explorer是落实。

http://blog.whatwg.org/the-road-to-html-5-contenteditable

马克芬克尔写了一个漂亮的high-level summary of designMode，后来又增加了a post about contentEditable。

来源

2011-04-16 09:32:58 Magnar

感谢兄弟，我检查了链接，很好的tut。 – Shaokan 2011-04-16 11:44:57

contentEditable不能在IE与彩车工作：

<p> 
    <img style="float:left" src="foo"> 
    <p contentEditable="true">very long text here ... 
    ... this text won't flow round the image</p> 
</p>

这是因为contentEditable触发臭名昭著hasLayout。除此之外，一切工作都很好。

来源

2011-04-16 13:12:56 user123444555621

嗯我不知道，非常感谢！哟预先警告我可能出现问题:) – Shaokan 2011-04-16 13:17:05

WYSIWYG编辑器在div上使用contenteditable有多可靠？

回答

相关问题