Ckeditor 选择的 html 在 chrome 浏览器中无法正常工作

Posted 2023-05-07

【中文标题】Ckeditor 选择的 html 在 chrome 浏览器中无法正常工作

【英文标题】：Ckeditor selected html not working correct with chrome browser

【发布时间】：2012-05-30 00:20:54

【问题描述】：

我正在使用 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 浏览器出现问题。

例如，假设在我的编辑器中有一个内容欢迎说明。如果我选择了“Welcome Note”并调用 getSelectedHtml() 方法 firefox,safari,IE8 返回带有 span 标签的“Welcome Note”，但 chrome 只返回文本“Welcome Note”。如果我尝试使用 CKEDITOR.instances.editor1.insertHtml("

"+ CKEDITOR.instances.editor1.getSelectedHtml()+"") 替换所选内容，在 chrome 中我丢失了字体颜色，因为 getSelectedHtml() 只返回选定的文本。但这适用于其他浏览器。

注意：如果内容是“欢迎Note" 选中的单词是“Welcome 注意”。在这种情况下，这在 chrome 和其他浏览器中是正确的。

请提出适当的解决方案。

【参考方案1】：

CKEDITOR 网站上记录了一些类似的案例。特别是，看看这个：

http://cksource.com/forums/viewtopic.php?f=11&t=20202