CKEditor не редактируется, когда открывается второй раз при всплывающем окне в Chrome - PullRequest
Новая
       20

CKEditor не редактируется, когда открывается второй раз при всплывающем окне в Chrome

4 голосов
/ 23 декабря 2011

Когда я открываю CKEditor во всплывающем окне (colorbox или fancybox), он работает нормально в первый раз.

Когда всплывающее окно закрывается и открывается во второй раз, область содержимого недоступна для щелчка / редактирования и не отображает содержимое.

Но содержимое отображается, когда я нажимаю кнопку «Источник»и тогда это доступно в представлении дизайна.Это нормально в IE и Firefox, но проблема в CHROME.

Я следовал тому, что сказано в Загрузка CKEditor в Colorbox не работает [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>

1 Ответ

0 голосов
/ 20 августа 2012

Вам нужно создать форму и внутри формы вставить текстовое поле. Присвойте fancybox форму id. В JavaScript-триггере нажмите на форму. В обратном вызове fancybox beforeLoad используется загрузчик CKEditor, который проверит, существует ли экземпляр, а если нет, то удалит его. В beforeLoad загрузка содержимого ckeditor из блока html.

...