JSP+CKEditor

阅读更多

首先需要下载CKEditor 和 CKEditor for java，下载地址：http://ckeditor.com/download（CKEditor for java在下面_(:з」∠)_）

我下的是full（完整版），解压全部复制到WebRoot下（←位置也行，只要能引用得到）如图：

解压CKEditor for java，吧jar包放到lib中（如果发现CKFinder的东东_(:з」∠)_请无视），如图：

 然后就能使用了︿(￣︶￣)︿，使用还是很简单的↓

首先要在页面中引入CKEditor的JS文件

 由于我的页面与ckeditor的文件夹是平级的，所以直接写了~实际需根据情况改变路径~

 

然后就是使用了，其实就是替换标签而已，</span><span style="line-height: 1.5;">有两种方法↓</span></p> <p><span style="line-height: 1.5;">eins：直接写在body中，CKEDITOR.replace()中的是name而不是id</span></p> <pre class="html" name="code"><form action="" method="post"> <textarea rows="100" cols="50" name="editor">  zwei：写在js中，必须写在 window.onload里，用变量edi可以方便之后的操作

    var edi = null;
    window.onload = function(){
        edi = CKEDITOR.replace('editor');
    }

 

editor.setData('_(:з」∠)_');//设置值
editor.getData();//获取值

 加载页面就能看到效果了

 至于为什么我的是绿色的~是因为这个文件→config.js 中设置了颜色

CKEDITOR.editorConfig = function( config ) {
	// Define changes to default configuration here. For example:
	// config.language = 'fr';
	config.uiColor = '#AADC6E';
};

 
关于配置的方法自定义新建一个配置文件，然后在实例化是引入或者实例化时直接配置：

edi = CKEDITOR.replace( 'editor', {
           customConfig:'ckeditor4.4/myConfig.js'
});

 

editor = CKEDITOR.replace( 'editor', 
       uiColor: '#AADC6E',
       language:'zh-cn'
});

 还有些常用的配置如下（以下当然为转载~）：

• language，defaultLanguage，contentLanguage, uiColor
• autoGrow_maxHeight, autoGrow_minHeight, resize_maxHeight, resize_minHeight, resize_maxWidth, resize_minWidth
• toolbarCanCollapse, toolbarGroups
• forcePasteAsPlainText, pasteFromWordKeepsStructure, pasteFromWordRemoveFontStyles, pasteFromWordRemoveStyles
• font_names, fontSize_sizes

 

 

 

• 
• 大小: 10.8 KB

• 
• 大小: 11.8 KB

• 
• 大小: 35.7 KB

• 查看图片附件