ckeditor4配置使用

来源:互联网 发布:mysql修改字段名 编辑:程序博客网 时间:2024/06/04 18:11

下载地址:http://ckeditor.com/download

下载时选择Full package

将得到的ckeditor文件夹拷贝到项目的WebRoot文件夹下

编写jsp文件引入ckeditor的js:

<script src="ckeditor/ckeditor.js"></script>

引入jquery的js:

<script src="jquery/jquery-1.4.2.min.js"></script>


第一种方式:

js脚本:

<script type="text/javascript">
    $(document).ready(function() {
        CKEDITOR.replace('editor1');
    });
</script>

编辑区域:

<textarea name="editor1">&lt;p&gt;Initial value.&lt;/p&gt;</textarea>


第二种方式:

无脚本:

编辑区域:

<textarea  class="ckeditor" name="editor1">&lt;p&gt;Initial value.&lt;/p&gt;</textarea>



默认给出了所有的toolbar,可以修改config.js进行配置:

包含所有toolbar的config.js:

/**
 * @license Copyright (c) 2003-2012, CKSource - Frederico Knabben. All rights reserved.
 * For licensing, see LICENSE.html or http://ckeditor.com/license
 */

CKEDITOR.editorConfig = function( config ) {
    // Define changes to default configuration here. For example:
    // config.language = 'fr';
    // config.uiColor = '#AADC6E';
    config.toolbar =
        [
        ['Source','-','Save','NewPage','Preview','-','Templates'],
        ['Cut','Copy','Paste','PasteText','PasteFromWord','-','Print', 'SpellChecker', 'Scayt'],
        ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
        ['Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField'],
        '/',
        ['Bold','Italic','Underline','Strike','-','Subscript','Superscript'],
        ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
        ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
        ['Link','Unlink','Anchor'],
        ['Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'],
        '/',
        ['Styles','Format','Font','FontSize'],
        ['TextColor','BGColor'],
        ['Maximize', 'ShowBlocks','-','About']
        ];
};


解决ie兼容性问题:

将myeclipse自动生成的jsp文件的文档定义:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

换成:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

原创粉丝点击