我正在使用 mvc 应用程序并使用 ckeditor 3.6.2 版本。我使用以下代码从 ckeditor 获取选定的 html。
CKEDITOR.editor.prototype.getSelectedHtml = function () {
if (CKEDITOR.env.ie) {
this.focus();
selection = this.getSelection();
} else {
selection = this.getSelection();
}
if (selection) {
var bookmarks = selection.createBookmarks(),
range = selection.getRanges()[0],
fragment = range.clone().cloneContents();
selection.selectBookmarks(bookmarks);
var retval = "",
childList = fragment.getChildren(),
childCount = childList.count();
for (var i = 0; i < childCount; i++) {
var child = childList.getItem(i);
console.log(child);
retval += (child.getOuterHtml ?
child.getOuterHtml() : child.getText());
}
return retval;
}
};
当我选择文本并调用 CKEDITOR.instances.editor1.getSelectedHtml() 时，Chrome 浏览器出现问题。
例如，假设在我的编辑器中有一个内容 <span style="color:red;">Welcome Note</span>。如果我选择了“Welcome Note”并调用 getSelectedHtml() 方法 firefox,safari,IE8 返回带有 span 标签的“Welcome Note”，但 chrome 只返回文本“Welcome Note”。如果我尝试使用 CKEDITOR.instances.editor1.insertHtml("<div style='font-size:12px'>"+ CKEDITOR.instances.editor1.getSelectedHtml()+"</div>") 替换所选内容，在 chrome 中我丢失了字体颜色，因为 getSelectedHtml() 只返回选定的文本。但这适用于其他浏览器。
注意：如果内容是“欢迎<span style="color:red;">注意</span>”，并且选中的词是“欢迎注意”。在这种情况下，这在 chrome 和其他浏览器中是正确的。
请提出适当的解决方案。