javascript - 用“p”包装“img”CKEditor

Question

我正在尝试为 CKEditor 4.1 编写插件，它将用 p 标签包装选定的 img。我在文档中发现了一些关于此的内容，但有什么问题？

var current = editor.getSelection();
if(current.getStartElement().getName() == 'img'){
    var p = new CKEDITOR.dom.element( 'p' );
    current.getSelectedElement().appendTo(p);
    alert('DONE');
}

当我单击调用此函数的按钮时，我得到的是空白空间而不是 img。怎么了？

Answer 1

尝试类似：

var current = editor.getSelection();
if(current.getStartElement().getName() == 'img'){
    var p = new CKEDITOR.dom.element( 'p', editor.document );
    p.insertBefore( current.getStartElement() );
    p.append( current.getStartElement() );
    alert('DONE');
}

Answer 2

将 <table> 包装成 <div class="table-wrapper"> 的示例

CKEDITOR.plugins.add('table_wrapper', { 
    init: function (editor) {
        editor.on('insertElement', function (event) {
            if (event.data.getName() === 'table') {
                var div = new CKEDITOR.dom.element('div').addClass('table-wrapper'); // Create a new div element to use as a wrapper.
                event.data.appendTo(div); // Append the original element to the new wrapper.
                event.data = div; // Replace the original element with the wrapper.
            }
        }, null, null, 1);
    }
});