Question

如果脚本仅在Fancybox打开的页面上加载，则CKEditor + Fancybox似乎有效。但是，如果父页面已初始化CKEditor，则任何Fancybox打开的页面上都会显示CKEditors，并且不会立即生效。

每个实例都有一个唯一的ID。

出现编辑器，但内容为空白，无法单击。单击SOURCE和其他按钮通常会触发全部功能。

我尝试将CKEDITOR.replaceAll();添加到Fancybox afterShow()回调中，没有运气。

任何人都有运气吗？

Answer 1

旧问题，但仅供参考，因为此问题仍然存在于两个模块的当前版本中..

解决这个问题的最佳方法是在小的超时后才在元素上创建ckeditor。

所以在这个例子中，.html页面有一个id为'ckeditor-textara'的文本区域。通过延迟分数，我可以让我的文本区域更可靠地渲染。（权衡只是ckeditor可用性略有延迟）

$.fancybox({
            'type' : 'ajax',
            'autoDimensions' : true,
            href : '/scat-porn.html',
            onComplete : function () {
                setTimeout(function() {
                    CKEDITOR.replace( 'ckeditor-textarea',
                    {
                        toolbar : 'Basic',
                        mode : 'wysiwyg'
                    });
                }, 500);
            },
            ...
            });

Fancybox与ck玩得不好;我认为因为它复制了一些与DOM混淆的ajax内容（虽然我没有花太多时间来验证这是确切的原因）。通过延迟ckeditor直到onComplete完成后，事情变得更好了。

Answer 2

基本上DOM事件正在被覆盖，所以你需要做的是在afterLoad上使用setTimeout来解决问题：

//all your existing stuff goes here...
$("#id_of_fancybox_thingy").fancybox({
    afterLoad:function(){
        setTimeout(function(){
        if (CKEDITOR.instances['elementname']) {
                CKEDITOR.instances['elementname'].destroy();
                delete CKEDITOR.instances['elementname'];
            }
            CKEDITOR.replace('elementname');
        }, 1000);
    }
});

Answer 3

$('a.fancybox').fancybox({
    parent: "body",
    afterLoad       :   function() {
        var editor = CKEDITOR.instances['post_body'];
        if(editor){
            CKEDITOR.instances['post_body'].destroy();
        }
        CKEDITOR.replace('post_body');
    },
    beforeLoad  :   function() {
    },
    beforeClose : function () {
        CKEDITOR.instances['post_body'].destroy();
    }
});

post_body - 是您的文字区域ID

CKEditor + Fancybox =失败？

3 个答案: