用 "p" CKEditor 包裝 "img"

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);
    }
});