1. 程式人生 > >如何在IntelliJ IDEA 中配置ueditor富文字外掛

如何在IntelliJ IDEA 中配置ueditor富文字外掛

        ueditor是一款百度開源的富文字編輯器外掛,相對國外的優秀的外掛,這個外掛比較適合中國人的口味,廢話不多說,先看看它長什麼樣,下圖就是我測試時的樣圖:


   安裝教程:1:下載外掛 http://ueditor.baidu.com/website/download.html  用java開發的選擇jsp版本 ,推薦使用utf-8版;

 

       2:解壓外掛,我解壓完了之後重新命名了,個人偏好

        

    3:將解壓後的資料夾貼上到專案中的web資料夾下

4:找到該檔案下的jsp/lib包,將裡面的包複製到專案裡的lib包中,作者的專案lib就在當前目錄 下,注意複製過去的包包名前有三角符號(可展開),才生效。

   ----->  

 到這一步就安裝完了,在瀏覽器中輸入http://localhost:8080/tomb/ueditor/jsp/controller.jsp?action=config 如果顯示如下則安裝成功


 前端配置說明:根據官網上的程式碼就可以,應該注意的是 :引用js檔案是有順序的,先要有config那個檔案。以下是我用的程式碼,複製過去注意修改引用js檔案的目錄:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>
Title</title> <!-- 配置檔案 --> <script type="text/javascript" src="../ueditor/ueditor.config.js"></script> <!-- 編輯器原始碼檔案 --> <script type="text/javascript" src="../ueditor/ueditor.all.js"></script> <!-- 例項化編輯器 --> </head> <body> <form action="result.jsp"
method="post"> <!-- 載入編輯器的容器 --> <script id="container" name="content" type="text/plain"> 這裡寫你的初始化內容 </script> <input type="submit" value="提交"/> </form> <script type="text/javascript"> var editor = UE.getEditor('container'); </script> </body> </html>

這個時候配置已經完成了,可以自己配置圖片等檔案訪問的相對路徑

最後要修正一個bug,這個版本不能線上顯示圖片,原因是在生成訪問路徑時多加了絕對路徑,在image.js裡的第900多行新增正則表示式,將多出的絕對路徑一部分切掉。切掉的部分要根據自己的專案而定,可以在網頁中檢視相關元素。


==================================================修改分界線==========================================================

最新版本可能解決了上述的bug,如果沒有出現問題,請忽略上述bug