Ckeditor 中一些核心的对象的作用

时间：2021-10-09 09:08:15

1.CKEditor

CKEditor对象用于掌管全局,他是一个单例对象,管理着所有实例化了的编辑框. 通过replace方法创建编辑框实例.

2.CKEditor.editor

表示一个编辑框实例,我们一般不直接new编辑框实例,而是通过CKEditor.replace方法 和 CKEditor.instances属性来获取编辑框实例.

CKEDITOR.replace( 'myeditor' );  

CKEDITOR.instances.myeditor

3.CKEditor.config

用于设置CKEditor的各种属性,如样式外观, 各种插件的添加删除, 有两种方式使用该对象

//IN-PAGE方式

CKEDITOR.replace( 'editor1',

    {

        extraPlugins = 'myplugin1,myplugin2',//扩展自己的插件

        //下面是CKEditor各种属性配置.

        toolbar :

        [

            ['Styles', 'Format'],

            ['Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', '-', 'About']

        ]

    });

//在config.js文件里面使用

CKEDITOR.editorConfig = function( config ) {

    config.skin = 'moono';

    config.uiColor = '#AADC6E';

};

4.CKEditor.plugins

用于插件的管理, 如插件的加载,扩展自定义插件等
所有的插件都放在ckeditor目录的plugins文件夹下面,每个插件都有一个单独的目录,目录的名字就是插件的名字,以自定义插件myplugin为例目录结构如下
Ckeditor 中一些核心的对象的作用

plugin.js文件是插件的主体文件, dialogs目录里面存放的是弹出对话框的创建代码, icons存放的是图标文件, lang就是语音文件
plugin.js文件内容如下

//添加插件并设置插件的名称

CKEDITOR.plugins.add('aaa', {

    init: function (editor) {

        //创建插件的主体.

        alert('Editor "' + editor.name + '" is being initialized!');

        //这样一个简单的插件就创建好了, 这个插件会在该插件初始化的时候弹出一个对话框显示ckeditor编辑框的名字

    }

});

同样我们还可以在插件的主体为插件添加一个触发按钮,或者把插件的触发添加到右键菜单,或者通过相应的dom事件触发都可以.
下面给一个比较完整的代码

5.CKEditor.ui

用于在编辑框上界面的修改,如添加按钮等

6.CKEditor.dialog

用于创建弹出的对话框

相关文章