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=''; 少了引号做字符串