CKEDITOR使用起来很简单,与很多JS UI控件一样,首先定义DOM,然后调用其function.其中有个基本方式就是通过Class来替换textarea.

例如:先创建一个textarea,给其设置一个Class,如content-editor

<textarea class="content-editor" name="Content"></textarea>

然后再执行CKEDIROT函数。

CKEDITOR.replace( 'content-editor', {
				customConfig: '',
				width:'700',
				height:'480',
				resize_enabled:false,
				toolbarLocation : 'top',
				toolbarCanCollapse:true,						
				
				extraPlugins:'smarttimer,syntaxhighlight',
				
				toolbarGroups:[					
					{ name: 'editing',     groups: [ 'find', 'selection', 'spellchecker' ] },
					{ name: 'links' },
					{ name: 'insert' },
					{ name: 'tools' },
					{ name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
					{ name: 'document',    groups: [ 'mode', 'document', 'doctools' ] },
					{ name: 'forms' },
					{ name: 'others' },
					'/',
					{ name: 'basicstyles', groups: [ 'basicstyles','cleanup' ,'undo'] },
					{ name: 'styles' },
					{ name: 'colors', groups:[ 'TextColor', 'BGColor']}					
				],			
				
				on: {				
					// Check for availability of corresponding plugins.
					pluginsLoaded: function( evt ) {
						var doc = CKEDITOR.document, ed = evt.editor;
						if ( !ed.getCommand( 'bold' ) )
							doc.getById( 'exec-bold' ).hide();
						if ( !ed.getCommand( 'link' ) )
							doc.getById( 'exec-link' ).hide();
					}
				}
			});

 

发表评论