Question

当我在弹出窗口（colorbox或fancybox）中打开CKEditor时，它第一次正常工作。

当弹出窗口关闭并第二次打开时，内容区域不可点击/可编辑且不显示内容。

但是当我单击“源”按钮然后在设计视图中可用时，内容显示。这在IE和Firefox中很好，但问题在于CHROME。

我已经按照CKEditor loading in Colorbox not working [ Google Chrome ]中的说法进行了操作，但我仍有这个问题。

以下是我的应用程序中的示例代码：

    <html>
<head>
    <title>CKEditor Sample</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript" src="http://ckeditor.com/apps/ckeditor/3.6.2/ckeditor.js?1324772165"></script>

    <link href="http://fancybox.net/js/fancybox-1.3.4/jquery.fancybox-1.3.4.css" rel="stylesheet" type="text/css" media="screen" />

    <script type="text/javascript" src="http://fancybox.net/js/fancybox-1.3.4/jquery.fancybox-1.3.4.js"></script>

    <script type="text/javascript">

        $(function() {
            if (CKEDITOR.instances['taCKEditor']) {
                delete CKEDITOR.instances['taCKEditor'];
            }
            CKEDITOR.config.height = '500px';
            CKEDITOR.config.width = '500px';
            CKEDITOR.config.enterMode = CKEDITOR.ENTER_BR;
            CKEDITOR.config.shiftEnterMode = CKEDITOR.ENTER_P;
            CKEDITOR.config.startupFocus = true;
            CKEDITOR.config.baseFloatZIndex = 9000;
            CKEDITOR.replace('taCKEditor',
        {
            uiColor: '#fdd1ad',
            toolbar:
            [
                ['Source', '-', 'NewPage', 'Preview'],
                ['Cut', 'Copy', 'Paste', 'PasteText', '-', 'Print', 'SpellChecker'],
                ['Undo', 'Redo', '-', 'Find', 'Replace', '-', 'SelectAll', 'RemoveFormat'],
                '/',
                ['Bold', 'Italic', 'Underline', 'Strike', '-', 'Subscript', 'Superscript'],
                ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'],
                ['Link', 'Unlink', 'Anchor'],
                ['Image', 'Table', 'HorizontalRule', 'Smiley', 'SpecialChar', 'PageBreak'],
                '/',
                ['Styles', 'Format', 'Font', 'FontSize'],
                ['TextColor', 'BGColor']
            ]
        });

            $("#various1").fancybox({
                'titlePosition': 'inside',
                'transitionIn': 'none',
                'transitionOut': 'none'
            });
        });
    </script>

</head>
<body>
    <a id="various1" href="#inline1" ">Open CKEditor</a>
    <div id="inline1">
        <textarea id="taCKEditor" name="taCKEditor" rows="2" cols="5">This is the sample text inside CKEditor</textarea>
    </div>
</body>
</html>

Answer 1

您需要创建表单和内部表单插入textarea。将fancybox指定为表单ID。在javascript触发器中单击表单。在fancybox回调beforeLoad中使用CKEditor加载程序，它将检查实例是否存在，如果不存在，那么它将删除它。在beforeLoad从html块加载到ckeditor内容。

Answer 2

我想我以前也遇到过同样的问题。您是否尝试过CKEDITOR.replace()。例如：

CKEDITOR.replace('taCKEditor');

然后执行CKEDITOR.instance。

还是您不认为delete引起了问题。无论如何，我只是假设。

在chrome中以弹出方式第二次打开时，CKEditor不可编辑

2 个答案: