富文本編輯器Ueditor之采坑系列

1、
將ueditor引入項目后,.............運行。圖片上傳功能不能用,會提示說沒有配置等等信息
報錯:ueditor 后端配置項沒有正常加載,上傳插件不能正常使用!jsp版本

原因:是因為沒有導入jar包,如圖lib文件夾下的五個jar包


f9bf85aed4aa389baa8ad6ba22f78b1.png

官方文檔:http://fex.baidu.com/ueditor/#server-jsp

2、問題1的上傳插件可以使用,上傳圖片,圖片上傳成功后不顯示。chrome控制臺報錯:404
解決辦法如下:給"imageUrlPrefix": ""設置為:"imageUrlPrefix": "http://localhost:8080/msxy-console/" /* http://localhost:8080/msxy-console/是服務器地址 */

image.png

3、在富文本編輯器編寫的帶有格式的內容在另一張頁面顯示時也帶有格式:
用ue.getContent()獲取內容,
var ue = UE.getEditor('editor');
//對編輯器的操作最好在編輯器ready之后再做
ue.ready(function() {
$('.save').click(function(){
var txt = ue.getContent(); //txt最好放在click方法內。//將txt存儲到數據庫中,然后加載數據庫中的txt展示在新的頁面上,顯示的格式和在ueditor中編輯的格式一樣
console.log(typeof txt); //string
$('.test').after(txt);
})
});
4、將編輯器上傳圖片存儲到數據庫:兩種方法

1、通過前端:獲取編輯內容的圖片的地址,然后提交到后臺接口,接口再存儲到數據庫中。然后另一張頁面再通過調用后臺接口,將圖片展示在頁面上。
2、通過后臺:轉載自:https://blog.csdn.net/lsx991947534/article/details/46586541
5、修改上傳圖片存儲的路徑。這樣可以避免重啟服務器后保存在服務器自己創(chuàng)建的文件夾下的圖片消失。
/* 修改前 "imagePathFormat": "/ueditor/jsp/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", 上傳保存路徑,可以自定義保存路 徑和文件名格式 /
"imagePathFormat": "/resources/img/{yyyy}{mm}{dd}/{time}{rand:6}", /
*/

1523605130(1).jpg

  借鑒自:https://blog.csdn.net/zzq900503/article/details/77540331

5、圖片上傳到遠程服務器
轉載自:https://blog.csdn.net/zzq900503/article/details/77540331
6、富文本編輯完內容后保存,再次進入富文本編輯器所在的頁面,會報錯,如下:
使用UEditor的setContent的時候報錯,報錯代碼如下 Uncaught TypeError: Cannot set property 'innerHTML' of undefined 錯
解決辦法:
原因是沒有等UEditor創(chuàng)建完成就使用UEditor的setContent函數了,可以通過如下代碼解決 方法一:

ueditor.addListener("ready", function () {
ueditor.setContent(code);
});
方法二:
ueditor.ready(function() {
ueditor.setContent(code);
});

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

友情鏈接更多精彩內容