CKEDITOR内联编辑器没有工具栏闪烁图标

时间:2015-12-16 13:04:15

标签: javascript ckeditor

我的网页上有CKEDITOR,允许用户编辑自定义可编辑内容的HTML段落,标题等。我查看this以删除内联编辑器默认工具栏,只要我在浮动对话框中创建自己的“工具栏”。

在我发布的链接中使用答案,当我尝试编辑双击时的任何元素(因为我将dblclick事件附加到为该元素创建CKEDITOR实例的所有元素时)它完美无缺,但是2-3秒后,我在对话框中用粗体显示文字,更改对齐等图标会闪烁(消失并重新出现),就好像你将某些内容重新加载到文档中一样。

任何人都知道为什么?看到重新加载的东西非常令人沮丧,但它(显然)不是。

提前致谢。

修改

抱歉,之前我无法发布我的代码,因为我正在工作。这就是我所拥有的:

CKEDITOR.disableAutoInline = true;
if (!CKEDITOR.instances.editorId) {
    CKEDITOR.inline('editorId', {
        plugins: 'toolbar,basicstyles,wysiwygarea,indent,link,list,find',
        autoParagraph: true,
        allowedContent: true,
        forcePasteAsPlainText: true,
        disableNativeSpellChecker: false,
        resize_enabled: false,
        stylesSet: 'default:styles.js',
        contentsCss: ['http://www.youblue.es/css/fonts.css'],
        title: false,
        removePlugins: 'toolbar'
    }); // I loaded all config here, taking advantage that I had to remove toolbar
}

这是我到目前为止没有预期结果的尝试:

CKEDITOR.appendTo('editorId', {
    plugins: 'toolbar,basicstyles,wysiwygarea,indent,link,list,find',
    autoParagraph: true,
    allowedContent: true,
    forcePasteAsPlainText: true,
    disableNativeSpellChecker: false,
    resize_enabled: false,
    stylesSet: 'default:styles.js',
    contentsCss: ['http://www.youblue.es/css/fonts.css'],
    title: false,
    removePlugins: 'toolbar'
}, '');
////////////////////////////////////////////////////
CKEDITOR.inline('editorId', {
    plugins: 'toolbar,basicstyles,wysiwygarea,indent,link,list,find',
    autoParagraph: true,
    allowedContent: true,
    forcePasteAsPlainText: true,
    disableNativeSpellChecker: false,
    resize_enabled: false,
    stylesSet: 'default:styles.js',
    contentsCss: ['http://www.youblue.es/css/fonts.css'],
    title: false,
    removePlugins: 'toolbar'
});
////////////////////////////////////////////////////
CKEDITOR.replace('editorId', {
    plugins: 'toolbar,basicstyles,wysiwygarea,indent,link,list,find',
    autoParagraph: true,
    allowedContent: true,
    forcePasteAsPlainText: true,
    disableNativeSpellChecker: false,
    resize_enabled: false,
    stylesSet: 'default:styles.js',
    contentsCss: ['http://www.youblue.es/css/fonts.css'],
    title: false,
    removePlugins: 'toolbar'
});

最准确的是inline函数调用,但正如我所提到的,编辑器加载时图标会闪烁。

希望这有帮助。

1 个答案:

答案 0 :(得分:0)

希望我找到了解决方案。在尝试删除工具栏插件时,我的CKEditor构建中出现了问题,但是当我在config中从此行中删除'toolbar'时它起作用了:

CKEDITOR.inline('editorId', {
    // ...
    plugins: 'toolbar,basicstyles,wysiwygarea,indent,link,list,find', // <- This one
    // ...
}

当我删除此行时停止闪烁图标:

removePlugins: 'toolbar'

似乎在您使用removePlugins时重新加载编辑器,但仅在删除toolbar插件时才重新加载。它没有删除工具栏而没有手动删除插件可能是因为在加载时出现了错误/与CKEditor冲突。为了避免这种情况,只需确保以正确的顺序加载所有JS,检查JS路径是否正确,并检查您是否有任何JS覆盖其他JS。

当我在这里发现解决方案后,我感到非常愚蠢和新手。我感到惭愧=(

对不起伙计们。