一、ckeditor

1）

下載ckeditor_3.6.2.zip和ckeditor-java-core-3.5.3.zip兩個壓縮檔案

2）

解壓縮檔案ckeditor_3.6.2.zip和ckeditor-java-core-3.5.3.zip兩個檔案，

在ckeditor_3.6.2檔案中有ckeditor資料夾；

ckeditor-java-core-3.5.3中有ckeditor-java-core-3.5.3.jar、 ckeditor-java-core-3.5.3-javadoc.jar和ckeditor-java-core-3.5.3-sources.jar三個jar包

3）

把ckeditor_3.6.2資料夾下的ckeditor整個複製到工程WebRoot下；

把ckeditor-java-core-3.5.3資料夾下的三個jar包複製到WebRoot—>WEB-INF—>lib資料夾下

4）

要使用就必須在jsp檔案中先引入ckeditor.js檔案

<scripttype="text/javascript"src="ckeditor/ckeditor.js"></script>

5）

新建一個textarea html物件

<textarea id="editor1" name="editor1">初始化文字</textarea>

用ckeditor替換html area

<script type="text/javascript"

或者

<ckeditor:replace replace="editor1" basePath="/ckeditor/" />

6）

效果圖

二、ueditor

1）

下載ueditor

下載地址：http://ueditor.baidu.com/website/download.html

2）

解壓縮檔案，並把資料夾名改為ueditor

ueditor\jsp\lib路徑下有commons-codec-1.9.jar、commons-fileupload-1.3.1.jar、commons-io-2.4.jar、json.jar、ueditor-1.1.2.jar五個jar包

3）

把整個ueditor資料夾複製到工程WebRoot下；

把ueditor\jsp\lib資料夾下的五個jar包複製到WebRoot—>WEB-INF—>lib資料夾下

4）

在jsp檔案中先引入ueditor.config.js、ueditor.all.js檔案

 </script>

 <!-- 配置檔案 -->

 <script type="text/javascript" src="ueditor.config.js"></script>

 <!-- 編輯器原始碼檔案 -->

 <script type="text/javascript" src="ueditor.all.js"></script>

5）

頁面中這麼使用

<!-- 載入編輯器的容器 -->

<script id="container" name="content" type="text/plain">

這裡寫你的初始化內容

<!-- 例項化編輯器 -->

<script type="text/javascript">

var ue = UE.getEditor('container');

</script>

6)

效果圖

7）

設定和讀取編輯器的內容

var ue = UE.getContent();

//對編輯器的操作最好在編輯器ready之後再做

ue.ready(function() {

    //設定編輯器的內容

    ue.setContent('hello');

    //獲取html內容，返回: <p>hello</p>

    var html = ue.getContent();

    //獲取純文字內容，返回: hello

    var txt = ue.getContentTxt();

});