java web專案中使用百度編輯器UEditor
寬為限 緊用功 工夫到 滯塞通
目錄結構
部署包解壓後的檔案目錄結構如下所示
ueditor解壓後的目錄列表dialogs: 彈出對話方塊對應的資源和JS檔案
lang: 編輯器國際化顯示的檔案
php或jsp或asp或net: 涉及到伺服器端操作的後臺檔案
themes: 樣式圖片和樣式檔案
third-party: 第三方外掛(包括程式碼高亮，原始碼編輯等元件）
ueditor.all.js: 開發版程式碼合併的結果,目錄下所有檔案的打包檔案
ueditor.all.min.js: ueditor.all.js檔案的壓縮版，建議在正式部署時採用
ueditor.config.js: 編輯器的配置檔案，建議和編輯器例項化頁面置於同一目錄
ueditor.parse.js: 編輯的內容顯示頁面引用，會自動載入表格、列表、程式碼高亮等樣式,具體看內容展示文件
ueditor.parse.min.js: ueditor.parse.js檔案的壓縮版，建議在內容展示頁正式部署時採用
引入資原始檔
<script type ="text/JavaScript"src="/admin/ueditor/ueditor.config.js"></script>
<script type ="text/javascript"src="/admin/ueditor/ueditor.all.js"></script>
<link rel =stylesheet href="/admin/ueditor/themes/default/css/ueditor.css">將 jar包放到專案的 lib目錄下
主體內容
<form 把容器放到form表單裡面，設定好要提交的路徑，它的內容是儲存到textarea裡的。js 通過UE.getEditor(a,b)這個方法載入編輯器主體，這裡有兩個引數 a 指定textarea 通過id指定。b 指定一些使用者自定義的配置，是一個數組，其中這裡的toolbars表示需要的工具按鈕名稱。前端頁面配置看這裡：http://fex.baidu.com/ueditor/#start-config
現在例子中後臺就一個傳遞作用，我這裡用的是spring mvc
/**
* UEditor
*/
@RequestMapping(value = "/ueditor")
public String ueditorShow(HttpServletRequest request, HttpServletResponse response) {
String attribute = request.getParameter("content");
System.out.println(attribute);
request.setAttribute("content", attribute);
return "/show";
}顯示頁面
</head>
<body>
<br> 內容為：
<br />
<divid="showContent"> ${requestScope.content}
</div>
</body>
</html>啥也不需要，只需將傳遞過來的content 接住顯示出來就OK！
test !
編輯頁面
顯示頁面
遇到的問題
以上看是簡單，卻搞了我一上午。下面分享一下我遇到的問題吧 √
其實也就一個，就是圖片上傳了編輯器了不顯示，現在回想看看是個非常簡單的問題，認真看看文件就可解決的，but我還是自己除錯找到的。。。
dbug ing…
發現問題：沒有專案名！！！
這裡請求圖片時報錯了！
除錯後發現原來這裡要配置 返回路徑字首
嗯，這裡加上去了
靠！問什麼會有兩專案名稱？？？
後來發現是路徑問題， 在專案名稱前加了個 /
這就OK了，圖片也可以獲取了，之前是 一直沒有專案名稱的
OK!
還有個問題
上傳圖片時開啟資料夾的延遲問題，點選上傳圖片彈窗開啟慢問題。
解決：
針對多圖片上傳， 將/ueditor/dialogs/image/image.js 檔案下的以下程式碼
accept: {
title: 'Images',
extensions: acceptExtensions,
mimeTypes: 'image/*'
},改為：
accept: {
title: 'Images',
extensions: acceptExtensions,
mimeTypes: 'image/gif,image/jpeg,image/png,image/jpg,image/bmp'
},針對單圖片上傳， 將/ueditor/ueditor.all.js or /ueditor.all.min.js (根據自己引用的檔案來確定) 檔案下的以下程式碼
accept="image/*"改為：
accept="image/gif,image/jpeg,image/png,image/jpg,image/bmp"