wangeditor上傳
1. wangeditor表情上傳錯誤
表情不只是一個代碼嗎？怎麼會報錯了，你錄入資料庫的時候把html編碼一下，顯示的時候在解碼回來看看行不行。、
2. wangEditor選中多張，但只有一張上傳了，是什麼原因
樓主注意下服務端的代碼，應該是只獲取了第一個，其他的PASS掉了
樓主需要改成循環
3. wangEditor.cmd.do()在ie11插入圖片失敗的解決辦法
我原本按照官方文檔的寫法，在圖片上傳成功的回調裡面將圖片插入富文本框
在ie11下圖片上傳成功了，但是圖片插不進去。
我去查了下源碼，發現他其實是通過 document.execCommand()去執行的。
這里傳的參數是 insertHTML ，ie不支持他，所以插入無效。
修改傳入參數，改成這種寫法
現在圖片是插進去了，但是他會自動選中圖片，於是我就讓游標移到最後，解決這個問題。
解決問題！
4. wangeditor 的使用和遇到的一些問題
父組件中使用
大致配置就這么多,還有顏色,字體,表情什麼的都可以配置,樣式的問題主要看項目需求,後來又加了模板的需求,所以又改了,wangeditor 中是沒有模板這個概念的,那麼我們怎麼實現這個功能呢,聽到這個需求的時候我都要考慮換富文本編輯器了,因為不知道換了其他的不知道有沒有其他的問題,後來試了試,使用了solt 插槽,看到可以的那一刻,哇,真開心
這個改過之後的布局,具體樣式的話,還需要自己調試,效果如下
大致能用了,雖然還有點奇怪,也沒有去改,其他的問題就是上傳的問題了,本例採用base64的方式上傳圖片,很多的就是渲染頁面時的樣式問題,如果出現渲染頁面滾動條的問題,可以修改源碼樣式後在打包
總之大致就這么多
5. wangeditor(富文本編譯器插件)
< link rel="stylesheet" href="plugins/wangeditor/min/wangEditor.min.css" />
< script src="plugins/wangeditor/min/wangEditor.min.js" ></ script >
< script src="jquery/jquery-2.1.1.min.js" ></ script >
< div id="editor" ></ div >
< input type="button" id="test1" value="拿html" />
< input type="button" id="test2" value="拿text" />
var E = window.wangEditor;
var editor =new E("#myEditor");
//開啟debug模式
editor.customConfig.debug =true;
// 關閉粘貼內容中的樣式
editor.customConfig.pasteFilterStyle =false;
// 忽略粘貼內容中的圖片
editor.customConfig.pasteIgnoreImg =false;
// 使用 base64 保存圖片
//editor.customConfig.uploadImgShowBase64 = true
// 上傳圖片到伺服器
editor.customConfig.uploadFileName ='editorFile'; //設置文件上傳的參數名稱
editor.customConfig.uploadImgServer ='upload1'; //設置上傳文件的伺服器路徑
editor.customConfig.uploadImgMaxSize =3 *1024 *1024; // 將圖片大小限制為3M
//自定義上傳圖片事件
editor.customConfig.uploadImgHooks = {
before:function(xhr, editor, files) {
},
success:function(xhr, editor, result) {
console.log("上傳成功");
},
fail:function(xhr, editor, result) {
console.log("上傳失敗,原因是" + result);
},
error:function(xhr, editor) {
console.log("上傳出錯");
},
timeout:function(xhr, editor) {
console.log("上傳超時");
}
}
editor.create();
$("#btnGetHtml").bind("click",function(){
// alert("hello world");
var content = editor.txt.html();
alert(content);
});
</script>
static StringUPLOAD_PATH ="/static/upload/";
@ResponseBody
@RequestMapping(value ="upload1", method = RequestMethod.POST)
public Mapupload1(MultipartFile editorFile, HttpServletRequest request) {
System.out.println("inner upload1");
Map result =new HashMap();
// 獲取文件後綴
String fileName = editorFile.getOriginalFilename();
String fileSuffix = fileName.substring(fileName.lastIndexOf("."));
// 文件存放路徑
String filePath = request.getSession().getServletContext().getRealPath(UPLOAD_PATH);
//網路地址類
InetAddress ia=null;
try {
//獲取本機網路地址
ia = ia.getLocalHost();
System.out.println(ia.getHostAddress());
}catch (UnknownHostException e) {
e.printStackTrace();
}
// 判斷路徑是否存在，不存在則創建文件夾
File file =new File(filePath);
if (!file.exists()) {
file.mkdirs();
}
// 將文件寫入目標
file =new File(filePath, UUID.randomUUID() + fileSuffix);
try {
editorFile.transferTo(file);
}catch (IOException e) {
e.printStackTrace();
}
// 獲取服務端路徑（拼接圖片上傳以後的網路訪問地址）
String serverPath = String.format("%s://%s:%s%s%s", request.getScheme(), ia.getHostAddress(), request.getServerPort(), request.getContextPath(), UPLOAD_PATH);
System.out.println(serverPath);
// 返回給 wangEditor 的數據格式
result.put("errno", 0);
result.put("data", new String[]{serverPath + file.getName()});
return result;
}
6. java.lang.exception文件上傳失敗
java.lang.exception文件上傳失敗解決方法：將文件的編碼方式改為utf-8即可。根據查詢相關資料信息，這個錯誤是在使用wangEditor配置多文件上傳的時候出現的，使用單個文件上傳沒有這個問題。直接使用多文件上傳一直報錯，就用了單文件循環。
7. 上傳發票java.lang.exception怎麼解決
解決辦法：在方法里加上參數註解 @RequestParam這個錯誤是在使用wangEditor配置多文件上傳的時候出現的，使用單個文件上傳沒有這個問題。直接使用多文件上傳一直報錯，就用了單文件循環。代碼如下：
public static Map uploadFilesForWEditor(@RequestParam("files")MultipartFile[] files,HttpServletRequest request,HttpServletResponse response){
Map map=new HashMap();
List url = new ArrayList();
for (int i = 0; i 0){
map.put("errno",0);
map.put("msg","上傳成功");
map.put("data",url);
}else{
map.put("errno",1);
map.put("msg","上傳失敗");
ma.put("data",url);
}
return map;
}
```
FileUploadUtils：
```java
public static String fileUpload(MultipartFile file,HttpServletRequest request,HttpServletResponse response){
//獲取圖片的原名字
String oldName=file.getOriginalFilename();
String timeName=System.currentTimeMillis()+"_";
String newName=timeName+oldName;
//獲取項目的路徑 在項目路徑下新建文件夾
Strng path= "D:/uploadFile";
//新建 uploadFile 文件夾
File parentPath=new File(path);
if(!parentPath.exists()){
parentPath.mkdirs();}
String src="";
try {
file.transferTo(new File(parentPath,newName));
File theFile=new File(parentPath+"/"+newName);
if(theFile.exists()){
//拼接圖片的相對路徑作為URL
src="/"+newName;
}else{
src="";
}
} catch (IllegalStateException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
return src;
8. wangeditor多圖上傳不會變成數組
wangeditor多圖上傳不會變成數組 編輯器問題。wangeditor是web富文本編輯器,在該編輯器進行多圖上傳就是要以數組的形式發送,這樣的形式才能成功發送使用多圖上傳時不會變成數組是編輯器問題,用戶只需要退出編輯器重新機內即可。
9. 請問通過富文本wangEditor編輯器編輯的文章，傳給後台，數據格式應該是什麼樣的啊
不創建是肯定的 應該是 var i=''; 少了引號做字元串