UEditor簡(jiǎn)單使用教程 UEditor新手入門指南

最近剛被分配了以個(gè)消息發(fā)布的任務(wù)，其中用到了富文本編輯器。
其實(shí)看ueditor功能很強(qiáng)大，不過百度的設(shè)計(jì)還是很不錯(cuò)的。只需要稍微配置一下就可以用了。
首先下載到 ueditor1_4_3-utf8-jsp.rar。
解壓以后整體拷貝到Java web項(xiàng)目的網(wǎng)頁(yè)根目錄下。我這里是用myeclipse建的項(xiàng)目，所以把ueditor拷貝到了WebRoot下即可。

第二步，引用ueditor/jsp/lib下的jar包。你可以選擇直接在java Build Path中配置，或者直接放入WebRoot/WEB-INF/lib文件夾中，項(xiàng)目會(huì)自動(dòng)引用該文件夾下的jar。推薦使用直接放到WEB-INF/lib下，這樣你的jar是隨著項(xiàng)目移動(dòng)的，系統(tǒng)會(huì)按照相對(duì)路徑加載項(xiàng)目下的jar。如果選擇第一種，如果當(dāng)jar文件移動(dòng)了，那么這個(gè)功能就會(huì)失效的。

第三步，在頁(yè)面上引入2個(gè)js文件
<scripttype="text/javascript"src="ueditor/ueditor.config.js"></script>
<scripttype="text/javascript"src="ueditor/ueditor.all.js"></script>

第四步，在頁(yè)面的編輯器位置，添加html代碼
<textareanametextareaname="content" id="myEditor"></textarea>
<scripttypescripttype="text/javascript">
UEDITOR_CONFIG.UEDITOR_HOME_URL = './ueditor/'; //一定要用這句話，否則你需要去ueditor.config.js修改路徑的配置信息
UE.getEditor('myEditor');
</script>

第五步，ueditor支持圖片、文檔、音樂等文件上傳功能，如果你想要配置上傳路徑，可以修改 ueditor/jsp/config.json。
這個(gè)文件對(duì)于每一個(gè)配置項(xiàng)，都明確的文字說明。附上一段圖片上傳的配置吧：
/* 上傳圖片配置項(xiàng) */
"imageActionName": "uploadimage"，/* 執(zhí)行上傳圖片的action名稱 */
"imageFieldName": "upfile"，/* 提交的圖片表單名稱 */
"imageMaxSize": 2048000，/* 上傳大小限制，單位B */
"imageAllowFiles": [".png"，".jpg"，".jpeg"，".gif"，".bmp"]，/* 上傳圖片格式顯示 */
"imageCompressEnable": true，/* 是否壓縮圖片，默認(rèn)是true*/
"imageCompressBorder": 1600，/* 圖片壓縮最長(zhǎng)邊限制 */
"imageInsertAlign": "none"，/* 插入的圖片浮動(dòng)方式 */
"imageUrlPrefix": ""，/* 圖片訪問路徑前綴 */
"imagePathFormat":"_images/image/{yyyy}{mm}{dd}/{time}{rand:6}"，/* 上傳保存路徑，可以自定義保存路徑和文件名格式 */

第六步，ueditor支持自定義功能，界面上顯示的功能都是可配置的，只要在ueditor/ueditor.config.js的toolbar中刪改配置即可，代碼如下：
//工具欄上的所有的功能按鈕和下拉框，可以在new編輯器的實(shí)例時(shí)選擇自己需要的從新定義
，toolbars: [[
'fullscreen'，'source'，'/'，'undo'，'redo'，'/'，
'bold'，'italic'，'underline'，'fontborder'，'strikethrough'，'superscript'，'subscript'，'removeformat'，'formatmatch'，'autotypeset'，'blockquote'，'pasteplain'，'/'，'forecolor'，'backcolor'，'insertorderedlist'，'insertunorderedlist'，'selectall'，'cleardoc'，'/'，
'rowspacingtop'，'rowspacingbottom'，'lineheight'，'/'，
'customstyle'，'paragraph'，'fontfamily'，'fontsize'，'/'，

12下一頁(yè)>

UEditor 1.4.3.4 官方版

• 軟件性質(zhì)：國(guó)產(chǎn)軟件
• 授權(quán)方式：免費(fèi)版
• 軟件語言：簡(jiǎn)體中文
• 軟件大小：9536 KB
• 下載次數(shù)：2047 次
• 更新時(shí)間：2019/4/3 13:31:08
• 運(yùn)行平臺(tái)：WinXP,Win7...
• 軟件描述：UEditor是由百度 Web前端研發(fā)部開發(fā)的所見即所得的富文本在線編輯器，具有... [立即下載]