將CKEditor元素與另一個元素一起插入

每當插入一個表元素（通過表格圖標）時，我想用另一個元素加上它。例如。將CKEditor元素與另一個元素一起插入

<div>Hello World!</div> <!-- this was automatically added --> 
<table> 
    <tr> 
    <td>A</td> 
    <td>A</td> 
    <td>A</td> 
    </tr> 
</table>

試圖用一個自定義的插件來實現這一點，但我不能得到它的工作：

(function ($) { 

    CKEDITOR.plugins.add('hello_world', { 
    init: function (editor) { 
     editor.on('insertElement', function(ev) { 
     if (ev.data.getName() === 'table') { 
      var helloWorld = new CKEDITOR.dom.element('div'); 
      helloWorld.appendText('Hello World!'); 
      ev.data.insertBeforeMe(helloWorld); 
     } 
     }); 
    } 
    }); 

})(jQuery);

控制檯返回一個「遺漏的類型錯誤：無法讀取屬性空的‘的insertBefore’」錯誤。但API文檔（http://docs.ckeditor.com/#!/api/CKEDITOR.dom.element）聲明insertBefore和insertBeforeMe函數可用。

來源

2017-06-21 Raf

您正在收到此錯誤，因爲在此階段，該元素尚未添加到CKEditor（因此其父項爲空）。

如果你不介意的元素之後添加評論，你可以使用下面的代碼來代替：

CKEDITOR.plugins.add('hello_world', { 
    init: function (editor) { 
     editor.on('insertElement', function(ev) { 
     if (ev.data.getName() === 'table') {   
      ev.data.append(new CKEDITOR.dom.comment(' this was automatically added '), true); 
     } 
     }); 
    } 
    });

然後你會得到下面的輸出：

<table><!-- this was automatically added -->

See JSFiddle here。

注意：如果你必須表之前添加註釋，你覺得勇敢，您可以通過使用計時器延遲添加註釋：

CKEDITOR.plugins.add('hello_world', { 
    init: function (editor) { 
     editor.on('insertElement', function(ev) { 
     if (ev.data.getName() === 'table') { 
      var table = ev.data; 
      setTimeout(function() { table.insertBeforeMe(new CKEDITOR.dom.comment(' this was automatically added '))}, 0); 
     } 
     }); 
    } 
    });

然後，您將獲得所需的輸出：

<!-- this was automatically added --> 
<table>

See JSFiddle here

來源

2017-06-22 09:23:50

將CKEditor元素與另一個元素一起插入

回答

相關問題