HTML WYSIWYG编辑器:为什么可编辑内容在iFrame中移动

时间:2012-06-26 07:25:35

标签: html editor tinymce ckeditor wysiwyg

为什么可编辑的html会移动到iFrame中?我分析了不同的编辑器(TinyMce,CKEditor等),并将可编辑内容移动到一个单独的iFrame中,它们放在原始文本上。

这是什么技术原因。我试验了contenteditable="true",这也是所有这些编辑的基础,并没有找到理由做到这一点。

2 个答案:

答案 0 :(得分:11)

我是CKEditor核心开发人员。不是很长一段时间 - 只是在今年下半年,但我已经了解了很多关于我们使用iframed可编辑的原因:)

  1. 样式 - iframed编辑器的内容不会继承页面的样式。这非常重要,因为我们无法重置样式(原文如此!CSS真的很糟糕)。更重要的是 - 在iframe中我们可以自由添加我们自己的风格,这也很有帮助。

  2. 只有iframed可编辑,我们才能在整个页面上使用head,metas,body styles,title等。我们的一些用户需要这个。

  3. 浏览器有很多错误(和不完整)的内容。例如。猜猜将列表粘贴到Firefox上可编辑的<h1>元素时会发生什么情况(您可以在此编辑器中检查 - http://createjs.org/demo/hallo/)?它将从可编辑区域泄漏出来,成为不可编辑的元素。我们必须在编辑器中手动处理这些情况,这真的很难:)。

  4. 我不确定这一点,但我相信designMode允许将整个文档切换到可编辑区域,并且contenteditable稍后出现。所以原因可能也是历史性的 - 很难从一种方法切换到另一种方法。

  5. 我们使用iframed可编辑的原因可能更多。我将在学习它们时更新我的​​答案:)

答案 1 :(得分:5)

From the tinymce froum

  

嗨Zappino!

     

像TinyMCE这样的编辑使用IFrame是非常本质的   在框架中,您可以修改HTML文档的任何部分以适合您的   需要不破坏主页文档中的任何内容。   特别是如果你想编辑一个完整的HTML文档,包括   如果没有,你将无法做到这一点   的IFrame。

     

如果您将TinyMCE的文件存储在a上,则会发生跨域抓取   与嵌入编辑器的页面不同(子)域。   向我们展示您所使用的安装的测试场景   麻烦,有人可能会帮助你!

     

来自德国的问候(回到德国)

     菲利克斯里斯特勒。