百度UEditor使用詳解
當我們還在使用FCKeditor時候，百度已經悄悄開發出了一套比它更強大的文字編輯器ueditor，專為中國人打造，請看--------：
web文字編輯器被廣泛的使用在論壇，留言系統，微博等網站，凡是使用者能釋出文字的網站，幾乎到會使用到文字編輯器，老盧今天給大家介紹一款中國人自己開放的開源文字編輯器，全球最大中文搜尋引擎--百度推出的UEditor。Ueditor是由百度web前端研發部開發的所見即所得富文字web編輯器，具有輕量，可定製，注重使用者體驗等特點，開源基於BSD協議，允許自由使用和使用程式碼.詳細可參見網站：
http://ueditor.baidu.com/index.html
好，現在跟老盧來看看如何使用：以JSP網站為例
1下載ueditor
訪問這個網址： http://ueditor.baidu.com/index.html，找到下載
然後下載ueditor1.1.7.zip或者其他的版本
2 解壓後我們會看到6個資料夾和3個js檔案以及一個更新日誌文字
其中：
官網上下載完整原始碼包，解壓到任意目錄，解壓後的原始碼目錄結構如下所示：
_examples：編輯器完整版的示例頁面
_demos：編輯器的各種使用案例
dialogs：彈出對話方塊對應的資源和JS檔案
themes：樣式圖片和樣式檔案
server：涉及到伺服器端操作的PHP、JSP等檔案
third-party：第三方外掛
editor_all.js：_src目錄下所有檔案的打包檔案
editor_all_min.js：editor_all.js檔案的壓縮版，建議在正式部署時才採用
editor_config.js：編輯器的配置檔案，建議和編輯器例項化頁面置於同一目錄
3 在你的web工程或網站根目錄下，新建一個名稱叫ueditor資料夾。複製所有這些資料夾和js到這個資料夾
到此準備工作完成
4 在JSP頁面包含所需要的JS和css
<script type="text/javascript" charset="utf-8" src="ueditor/editor_config.js"></script>
<script type="text/javascript" charset="utf-8" src="ueditor/editor_all_min.js"></script>
<link rel="stylesheet" type="text/css" href="ueditor/themes/default/ueditor.css" />
在此注意：引用的js或css必須正確，否則顯示不出來
我的ueditor資料夾和JSP檔案同在根目錄，所以寫成以上。
5 修改editor資料夾下邊的editor_config.js檔案中的第七行。
把變數URL修改：var URL= "/你的網站名稱或web工程名稱/ueditor/";
舉例：我的工程名稱是laoluit
那麼我修改後是var URL= "/laoluit/ueditor/";
6 新增編輯器
<body>
<form action="dopost.jsp" method="post">
<script type="text/plain" id="myEditor" class="myEditor">
</script>
<input type="submit" value="發帖">
</form>
<script type="text/javascript">
var editor = new baidu.editor.ui.Editor();
editor.render('myEditor');
</script>
</body>
6 在另一個jsp或servlet中接收提交的資料
<%
//表單提交到了dopost.jsp,編輯器中編寫的內容預設名稱是editorValue
//所以通過request.getParameter("editorValue")可以得到
//接收到資料後列印到後臺，你可以把它儲存到資料庫中。
System.out.println(request.getParameter("editorValue"));
%>
7 補充
設定編輯器中預設值：
<script language="javascript" type="text/javascript">
var op = {
initialContent: '預設值。。。。。', //初始化編輯器的內容
minFrameHeight: 1024 //設定預設高度
};
var editor = new baidu.editor.ui.Editor(op);
editor.render('myEditor');
</script>