Chrome execCommand('insertHTML')行为

最后发布: 2014-04-29 03:25:53


问题

在开发某种具有不可编辑的块的WYSIWYG编辑器时,我发现了Chrome(和Safari)中的有趣行为:当您在div使用contenteditable="true" (或另一个元素)创建execCommand('insertHTML')时-工作正常,如您所愿。 但是,如果您尝试在没有“ contenteditable ”的嵌套div执行它-浏览器将删除所有属性,而是根据CSS添加style

jsfiddle: http : //jsfiddle.net/DXz9e/2/

尝试插入内部和外部文本。 并查看html代码。 我在外部看到(内容可编辑):

<span id="newInsertedNode" class="constructor-input-field" data-id="23">Some text</span>

在内部:

<span style="background-color: red; color: blue;">Some text</span>

我只想说:“到底发生了什么?” 在FF中也可以正常工作

javascript html google-chrome execcommand
回答

一种解决方案是不使用Span元素(请参阅此处: https : //dev.ckeditor.com/ticket/9004 )。