0

我正在为 Ckeditor 4.5 创建一个插件，我正在使用经典的 iframe 安装，下面是向工具栏添加一个按钮的工作代码，按下该按钮时会创建一个 div.cke-column 元素并将其插入到文本区域包装中任何选定的内容。我无法弄清楚的是在插入这些 div 之后，我想在每个具有特定类的 div 上调用一个简单的 js 函数（js 使我能够拥有一个动态属性，该属性会根据 div 的数量而发生很大变化特克斯区）。特别是在下面的代码示例中，我想在每个 div.cke-column 插入 ckeditor 的 textarea 后对它们执行一个 javascript 函数。

(function($) {
 CKEDITOR.plugins.add( 'simple_columns_plugin', {
  init: function( editor )
  {
   var pluginDirectory = this.path;

  CKEDITOR.scriptLoader.load( pluginDirectory + '/lib/customscript.js', function() {

  } );

   editor.addContentsCss( pluginDirectory + '/styles/basic.css' );
   editor.addCommand( 'insert_column_wrapper_command', {
    exec : function( editor ) {
    var columnwrapper = editor.document.createElement( 'div' );
    columnwrapper.setAttribute('class', 'cke-column');
    var innercontent = editor.getSelectedHtml(toString);
    columnwrapper.setHtml(innercontent);
    editor.insertElement(columnwrapper);
    }

   });

   editor.ui.addButton( 'simple_columns_plugin_button', {
    label: 'Insert column', //this is the tooltip text for the button
    command: 'insert_column_wrapper_command',
    icon: this.path + 'images/cw2.gif'
   });
  }
 });
})(jQuery);

我还应该补充一点，我不希望运行一个 javascript 函数并插入静态 HTMl，这个 javascript 函数会在调整窗口大小时发生变化，因此它需要最初调用一个函数并且可用于 onresize 事件。

4

1 回答 1

0

每个元素甚至整个文档都可以通过使用适当的api函数直接访问。这是一个向元素添加类的示例和一个使用 jQuery 直接影响文档的示例。以下是一些展示答案的片段

var elem = editor.document.findOne('.someclass'); // Get element
elem.addClass('anotherclass'); // add class to element
jQuery( editor.editable().$ ).css( 'color', 'red' ); // directly effect editable content in jQuery.
 var fullcontent = editor.getData(); // Get all content in editable textarea
于 2015-07-29T15:57:23.457 回答