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为例目录结构如下
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
用于创建弹出的对话框