專案中用到的富文字框編輯器wangEditor
阿新 • • 發佈:2019-01-10
文件地址:http://www.wangeditor.com/index.html
<div id="div1"></div> <script src="js/wangEditor.min.js"></script> var E = window.wangEditor var editor = new E('#div1') editor.customConfig.uploadImgShowBase64 = true // 使用 base64 儲存圖片 // 配置伺服器端地址 editor.customConfig.uploadImgServer = url + '/fileResultContrller/editorUpLoad' editor.customConfig.uploadFileName = 'file' //上傳的欄位 editor.customConfig.uploadImgHooks = { success : function(xhr, editor, result) { // 圖片上傳並返回結果,圖片插入成功之後觸發 // xhr 是 XMLHttpRequst 物件,editor 是編輯器物件,result 是伺服器端返回的結果 if (result.success) { var s = editor.txt.html(); //獲取富文字框的值 s += "<img src='"+result.body.data[0].filePath+result.body.data[0].fileName+"'>"; editor.txt.html(s) //設定富文字框的值 } else { alert(result.msg) } }, fail : function(xhr, editor, result) { //console.log(result); // 圖片上傳並返回結果,但圖片插入錯誤時觸發 // xhr 是 XMLHttpRequst 物件,editor 是編輯器物件,result 是伺服器端返回的結果 if (result.success) { var s = editor.txt.html(); s += "<img src='"+result.body.data[0].filePath+result.body.data[0].fileName+"'>"; editor.txt.html(s) } else { alert(result.msg) } //return false; //insert(s); }, error : function(xhr, editor) { // 圖片上傳出錯時觸發 // xhr 是 XMLHttpRequst 物件,editor 是編輯器物件 }, timeout : function(xhr, editor) { // 圖片上傳超時時觸發 // xhr 是 XMLHttpRequst 物件,editor 是編輯器物件 }, } // 進行下文提到的其他配置 // …… // …… // …… editor.create()