js实现图片粘贴上传到服务器并展示的实例(2)

// 处理粘贴事件
  $("#aaa").on('paste', function(eventObj) {
   // 处理粘贴事件
   var event = eventObj.originalEvent;
   var imageRe = new RegExp(/image\/.*/);
   var fileList = $.map(event.clipboardData.items, function (o) {
    if(!imageRe.test(o.type)){ return }
    var blob = o.getAsFile();
    return blob;
   });
   if(fileList.length <= 0){ return }
   upload(fileList);
   //阻止默认行为即不让剪贴板内容在div中显示出来
   event.preventDefault();
  });
  function upload(fileList) {
   for(var i = 0, l = fileList.length; i < l; i++){
    var fd = new FormData();
    var f = fileList[i];
    fd.append('files', f);
    var editor=document.getElementById("aaa");
    $.ajax({
     url:"/upload_editor_photo3",
     type: 'POST',
     dataType: 'json',
     data: fd,
     processData: false,
     contentType: false,
     xhrFields: { withCredentials: true },
     headers: {
      'Access-Control-Allow-Origin': '*',
      'Access-Control-Allow-Credentials': 'true'
     },
     success: function(res){
      var len=res.data.length;
      for ( var i = 0; i < len; i ++) {
       var img = document.createElement('img');
       img.src = res.data[i]; //设置上传完图片之后展示的图片
       editor.appendChild(img);
      }
     },
     error: function(){
      alert("上传图片错误");
     }
    });
   }
  }

<div id="aaa" contentEditable="true" style="height:800px;border:1px solid #ccc"></div>

{
 // errno 即错误代码，0 表示没有错误。
 //  如果有错误，errno != 0，可通过下文中的监听函数 fail 拿到该错误码进行自定义处理
 errno: 0,

 // data 是一个数组，返回若干图片的线上地址
 data: [
  '图片1地址',
  '图片2地址',
  '……'
 ]
}