jQuery 中如何使用formdata 上传图片？

Question

图片在上传过程中，需要将图片转换成 二进制数据，要怎么写呢？网上找的都不合适。我是这样写的，因为在上传前需要预览，也可以多图上传，下面的方法是获取不到图片数据的，只能获取到图片的name,type,size:

<div class="anviz-upload-file">
    <div class="image-item">
        <input id="file" type="file" />
    </div>
</div>

function getImgList(){
    var myfile = document.getElementById('file');    
    var List = document.getElementsByClassName('img-list')[0];
    
    myfile.onchange = function(){
        var files = this.files;
        if(!files)return;
        if(files.length > 0){
            jQuery('#imgList').show();        
        }else{
            jQuery('#imgList').hide();        
        }
        
        var fileArr =  [];
        var fileEntity = {};
        if(files){
            for(var i = 0;i<files.length;i++){    
                var reader = new FileReader();
                reader.onload = function() {
                      //处理 android 4.1 兼容问题
                    var base64 = reader.result.split(',')[1];
                    var dataUrl = 'data:image/png;base64,' + base64;

                    var blob = dataURLtoBlob(dataURL);
                }
                
                //chrome，firefox并且safari浏览器不能正常工作,必须重新将对象组织
                fileEntity.name = files[i].name;
                fileEntity.type = files[i].type;
                fileEntity.size = files[i].size;
                fileEntity.lastModified = files[i].lastModified;
                fileEntity.lastModifiedDate = files[i].lastModifiedDate;
                fileEntity.webkitRelativePath = files[i].webkitRelativePath;
                
                fileArr.push(fileEntity);
                var data = JSON.stringify(fileArr);
                sessionStorage.setItem('arr',data);
                
                var oLi = '<li><img src="'+URL.createObjectURL(files[i])+'"><span class="close" onclick="closeli(this)" >&times;</span></li>';    
                List.innerHTML+=oLi; 
            }
        }
    }
}

感谢陌路凡歌（4.4k 声望）的帮助下写了formdata的方法，下面是所有数据的组织：

function buildJson() {
    var arr = JSON.parse(sessionStorage.getItem('arr'));
    var formData = new FormData(); 
    formData.append("files", arr);

    var jsonObj = {'imgList':formData};
    return jsonObj;
}

FormData的数据在调试中显示为，我从调试中感觉这个数据似乎不太对，imgList[]都为空，FormData到底是不是把图片都转成了二进制的方法，看不到啊：

Answer 1

直接push，有兴趣可以看看我的博客链接描述

//onchange 
    for(var i = 0;i<files.length;i++){                
         fileArr.push(files[i]);
        //....图片的预览操作
    }


//提交
function sub(){    
var formData = new FormData();    
    for(var i =0;i<fileArr.length;i++){    //提交时，我们把fileArr中的数据遍历一遍
        formData.append("upfile[]", fileArr[i]); 
    };
    $.ajax({
          url: "1.php",
          type: "POST",
          data:formData,
          cache:false,         //不设置缓存
          processData: false,  // 不处理数据
          contentType: false   // 不设置内容类型
    });    
}