Kindeditor图片粘贴上传(chrome)

 1 kindeEditor = KindEditor.create(‘#updatePapers_contentEditor‘, {
 2 
 3     /***
 4      * 图片上传必须使用绝对路径,因为KindeEditor有个缺陷,
 5      * 它的批量上传和单个上传界面文件在不同级别的目录下,
 6      * 用相对路径时,总是只能成功一种模式,另一种就不会成功,所以只能这样用绝对路径.
 7      */
 8     uploadJson : ‘/fileupload‘,//服务器文件上传接收程序路径
 9     urlType : ‘‘,
10     resizeType:0,
11     //调用kindeditor的afterCreate回调函数对kindeditor功能进行“扩展”，实现图片粘贴上传。
12     afterCreate:function() {
13         var editerDoc = this.edit.doc;//得到编辑器的文档对象
14         //监听粘贴事件, 包括右键粘贴和ctrl+v
15         $(editerDoc).bind(‘paste‘, null, function (e) { 
16             /*获得操作系统剪切板里的项目，e即kindeditor,
17              *kindeditor创建了originalEvent(源事件)对象，
18              *并指向了浏览器的事件对象，而chrome浏览器
19              *需要通过clipboardData(剪贴板数据)对象的items
20              *获得复制的图片数据。
21              */
22             var ele = e.originalEvent.clipboardData.items;
23             for (var i = 0; i < ele.length; ++i) {
24                 //判断文件类型
25                 if ( ele[i].kind == ‘file‘ && ele[i].type.indexOf(‘image/‘) !== -1 ) {
26                     var file = ele[i].getAsFile();//得到二进制数据
27                     //创建表单对象，建立name=value的表单数据。
28                     var formData = new FormData();
29                     formData.append("imgFile",file);//name,value
30 
31                     //用jquery Ajax 上传二进制数据
32                     $.ajax({
33                         url : ‘/fileupload?dir=image‘,
34                         type : ‘POST‘,
35                         data : formData,
36                         // 告诉jQuery不要去处理发送的数据
37                         processData : false,
38                         // 告诉jQuery不要去设置Content-Type请求头
39                         contentType : false,
40                         dataType:"json",
41                         beforeSend:function(){
42                             //console.log("正在进行，请稍候");
43                         },
44                         success : function(responseStr) {
45                             //上传完之后，生成图片标签回显图片，假定服务器返回url。
46                             var src = responseStr.url;
47                             var imgTag = "<img src=‘"+src+"‘ border=‘0‘/>";
48 
49                             //console.info(imgTag);
50                             //kindeditor提供了一个在焦点位置插入HTML的函数，调用此函数即可。
51                             kindeEditor.insertHtml(imgTag);
52 
53 
54                         },
55                         error : function(responseStr) {
56                             console.log("error");
57                         }
58                     });
59 
60                 }
61 
62             }
63 
64 
65         });
66     }
67 });