1.HTML 環境搭建

百度富文字下載地址

http://ueditor.baidu.com/website/download.html

解壓完成之後的目錄（沒有demo.html）

根據官方文件說明可以建立一個demo.html 

也可以直接修改index.html 來進行開發

建立一個富文字框的最簡程式碼為

 <!-- 載入編輯器的容器 -->
    <script id="container" name="content" type="text/plain">
        這裡寫你的初始化內容
    </script>
    <!-- 配置檔案 -->
    <script type="text/javascript" src="ueditor.config.js"></script>
    <!-- 編輯器原始碼檔案 -->
    <script type="text/javascript" src="ueditor.all.js"></script>
    <!-- 例項化編輯器 -->
    <script type="text/javascript">
        var ue = UE.getEditor('container');
    </script>
 

放在網頁中即可顯示

二。jsp環境搭建
上面說的都是html 的
現在來說說 在jsp專案中的使用。
將下載的檔案放在wen專案的 webRoot 下
（這時候使用富文字框的時候要注意一下js檔案的引用路徑）
注意：
jsp資料夾下面有一個lib包，裡面存放了需要用到的jar包
將這些jar包放置在WEB-INF/lib的目錄下
如果使用maven 管理專案的話，因為maven遠端倉庫跟本地倉庫都是沒有 ueditor 的jar的，所以需要手動配置新增到本地倉庫
三。與Struts2 整合，
經過上面的步驟，我相信大家一定已經成功將富文字框顯示出來了。
效果是這樣的
但是如果有人的專案中使用了Struts來封裝 servlet 一定就發現了一些問題
沒錯    圖片附件之類的沒法上傳

找不到檔案的資料
這是因為 Struts2中有實現好的檔案上傳功能，攔截器會攔截檔案上傳的請求然後使用預設的檔案上傳功能。這樣ueditor的檔案上傳就沒法接收到請求，接收不到檔案的資料
解決方法：在Struts.xml中新增配置項，遮蔽到對ueditor請求的攔截
 

<constant name="struts.action.excludePattern" value="/ueditor/.*" />

* 前後端通訊相關的配置,註釋只允許使用多行方式 */
{
    /* 上傳圖片配置項 */
    "imageActionName": "uploadimage", /* 執行上傳圖片的action名稱 */
    "imageFieldName": "upfile", /* 提交的圖片表單名稱 */
    "imageMaxSize": 2048000, /* 上傳大小限制，單位B */
    "imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 上傳圖片格式顯示 */
    "imageCompressEnable": true, /* 是否壓縮圖片,預設是true */
    "imageCompressBorder": 1600, /* 圖片壓縮最長邊限制 */
    "imageInsertAlign": "none", /* 插入的圖片浮動方式 */
    "imageUrlPrefix": "", /* 圖片訪問路徑字首 */
    "imagePathFormat": "/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上傳儲存路徑,可以自定義儲存路徑和檔名格式 */
                                /* {filename} 會替換成原檔名,配置這項需要注意中文亂碼問題 */
                                /* {rand:6} 會替換成隨機數,後面的數字是隨機數的位數 */
                                /* {time} 會替換成時間戳 */
                                /* {yyyy} 會替換成四位年份 */
                                /* {yy} 會替換成兩位年份 */
                                /* {mm} 會替換成兩位月份 */
                                /* {dd} 會替換成兩位日期 */
                                /* {hh} 會替換成兩位小時 */
                                /* {ii} 會替換成兩位分鐘 */
                                /* {ss} 會替換成兩位秒 */
                                /* 非法字元 \ : * ? " < > | */
                                /* 具請體看線上文件: fex.baidu.com/ueditor/#use-format_upload_filename */
 

重點關注 imageUrlPrefix  和   imagePathFormat
imageUrlPrefix 中配置專案名
imagePathFormat 中配置檔案需要儲存的路徑
修改如下：

 /* 上傳圖片配置項 */
    "imageActionName": "uploadimage", /* 執行上傳圖片的action名稱 */
    "imageFieldName": "upfile", /* 提交的圖片表單名稱 */
    "imageMaxSize": 2048000, /* 上傳大小限制，單位B */
    "imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 上傳圖片格式顯示 */
    "imageCompressEnable": true, /* 是否壓縮圖片,預設是true */
    "imageCompressBorder": 1600, /* 圖片壓縮最長邊限制 */
    "imageInsertAlign": "none", /* 插入的圖片浮動方式 */
    "imageUrlPrefix": "/newschange/", /* 圖片訪問路徑字首 */
    "imagePathFormat": "/ueditor/images/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上傳儲存路徑,可以自定義儲存路徑和檔名格式 */
                                /* {filename} 會替換成原檔名,配置這項需要注意中文亂碼問題 */
                                /* {rand:6} 會替換成隨機數,後面的數字是隨機數的位數 */
                                /* {time} 會替換成時間戳 */
                                /* {yyyy} 會替換成四位年份 */
                                /* {yy} 會替換成兩位年份 */
                                /* {mm} 會替換成兩位月份 */
                                /* {dd} 會替換成兩位日期 */
                                /* {hh} 會替換成兩位小時 */
                                /* {ii} 會替換成兩位分鐘 */
                                /* {ss} 會替換成兩位秒 */
                                /* 非法字元 \ : * ? " < > | */
                                /* 具請體看線上文件: fex.baidu.com/ueditor/#use-format_upload_filename */

之後在執行測試，發現真正的成功了。