ckeditor bug嵌套divs bug的解决方法?

时间:2011-06-13 14:43:25

标签: javascript ckeditor fckeditor

此错误的任何建议或解决方法?
http://dev.ckeditor.com/ticket/6436
我真的需要绕过这个bug,因为我需要在CKEditor的编辑器区域中删除带有一个退格的整个div。但是在插入时,div会因为bug而嵌套。因此,删除单个div是不可能的。

2 个答案:

答案 0 :(得分:1)

答案 1 :(得分:1)

我遇到了同样的问题,遗憾的是,ghostCoder修复程序的链接不再可用。

除了嵌套的divs问题之外,我们还强制粘贴为纯文本(因此数据被粘贴为纯文本,除非使用“从word粘贴”)并且我们使用div作为我们的enterMode。在粘贴的数据中,换行符替换为< br />标签,而我们希望每一行都是元素内的包装。

这就是我最终如何解决这个问题。您应该知道我们没有更改autoParagraph config option所以它默认为true,我不建议在配置级别禁用它。我会尝试对这个解决方案进行良好的编码,这样你就可以很好地了解这里实际做了什么。

config.on.instanceReady = function(e) {
    var enterMode = e.editor.config.enterMode, elem = 'div';
    if(enterMode === CKEDITOR.ENTER_P) {
        elem = 'p';
    }

    // We didn't encounter any issues when using br as enterMode so
    // continue only if enterMode is div or p element
    if(enterMode === CKEDITOR.ENTER_DIV || enterMode === CKEDITOR.ENTER_P) {
        // Disable autoParagraph in initialization to avoid nested div issue.
        // When autoParagraph is manipulated this way it will still be active
        // later on so if you write some inline content in source mode it
        // will be properly wrapped inside <p> or <div> element.
        e.editor.config.autoParagraph = false;

        // Handle paste event to get rid of <br /> line breaks issue
        e.editor.on('paste', function(evt) {
            var data = '';

            // Stop event, handle everything here manually
            evt.stop();

            // Get data either from event's text or html property
            if(evt.data.text) {
                // Remove HTML markup from pasted data
                data = evt.data.text.replace(/(<([^>]+)>)/ig, '');
                // Replace all line breaks with </div><div> or </p><p> markup
                // And wrap the whole content inside <div> or <p> element
                data = '<' + elem + '>'
                 + data.replace(/\r\n|\r|\n/g, '</' + elem + '><' + elem + '>')
                 + '</' + elem + '>';
            } else {
                // If data was not pasted as plain text just
                // get data as is from event's html property
                data = evt.data.html;
            }

            // Insert HTML data to editor
            evt.editor.insertHtml(data);
            // Fire afterPaste manually as we have stopped the event
            // and afterPaste wouldn't get triggered otherwise
            evt.editor.fire( 'afterPaste' );
        }, e.editor.element.$);
    }
};
相关问题