ajax 同时上传多张图片

我用下文所示代码书写时，似乎一次只传一张

                var formData = new FormData();
            formData.append('file', $('#file1')[0].files[0]);
            formData.append('file', $('#file2')[0].files[0]);  
            formData.append('file', $('#file3')[0].files[0]);  
            formData.append("fname",fname);
            formData.append("fprice",fprice);
            formData.append("fdetail",fdetail);
            formData.append("meterial",meterial); 
             $.ajax({
                    url : "./insert", 
                    type : "POST",
                    data :formData,
                    async : true,
                    cache : false,
                    contentType : false,
                    processData : false,
                    success : function(data) {
                        if(data=="success"){
                            alert("添加成功!")
                            window.location.href="#"
                        }else{
                            alert("添加失败！")
                        }
                    }
             }); 

在查阅资料后发现一个网站有相关资料（包含演示效果）：http://www.17sucai.com/pins/demo-show?id=26463

分析后发现他是自己有个 uploadImg.js，上传照片时调用该 js 文件，代码如下：

var imgSrc = []; //图片路径
var imgFile = []; //文件流
var imgName = []; //图片名字
//选择图片
function imgUpload(obj) {
	var oInput = '#' + obj.inputId;
	var imgBox = '#' + obj.imgBox;
	var btn = '#' + obj.buttonId;
	$(oInput).on("change", function() {
		var fileImg = $(oInput)[0];
		var fileList = fileImg.files;
		for(var i = 0; i < fileList.length; i++) {
			var imgSrcI = getObjectURL(fileList[i]);
			imgName.push(fileList[i].name);
			imgSrc.push(imgSrcI);
			imgFile.push(fileList[i]);
		}
		addNewContent(imgBox);
	})
	$(btn).on('click', function() {
		var data = new Object;
		data[obj.data] = imgFile;
		submitPicture(obj.upUrl, data);
	})
}
//图片展示
function addNewContent(obj) {
	$(imgBox).html("");
	for(var a = 0; a < imgSrc.length; a++) {
		var oldBox = $(obj).html();
		$(obj).html(oldBox + '<div class="imgContainer"><img title=' + imgName[a] + ' alt=' + imgName[a] + ' src=' + imgSrc[a] + ' onclick="imgDisplay(this)"><p onclick="removeImg(this,' + a + ')" class="imgDelete">删除</p></div>');
	}
}
//删除
function removeImg(obj, index) {
	imgSrc.splice(index, 1);
	imgFile.splice(index, 1);
	imgName.splice(index, 1);
	var boxId = "#" + $(obj).parent('.imgContainer').parent().attr("id");
	addNewContent(boxId);
}
//上传(将文件流数组传到后台)
function submitPicture(url,data) {
	console.log(data);
	alert('请打开控制台查看传递参数！');
	if(url&&data){
		$.ajax({
			type: "post",
			url: url,
			async: true,
			data: data,
			traditional: true,
			success: function(dat) {
	//			console.log(dat);
			}
		});
	}
}
//图片灯箱
function imgDisplay(obj) {
	var src = $(obj).attr("src");
	var imgHtml = '<div style="width: 100%;height: 100vh;overflow: auto;background: rgba(0,0,0,0.5);text-align: center;position: fixed;top: 0;left: 0;z-index: 1000;"><img src=' + src + ' style="margin-top: 100px;width: 70%;margin-bottom: 100px;"/><p style="font-size: 50px;position: fixed;top: 30px;right: 30px;color: white;cursor: pointer;" onclick="closePicture(this)">×</p></div>'
	$('body').append(imgHtml);
}
//关闭
function closePicture(obj) {
	$(obj).parent("div").remove();
}

//图片预览路径
function getObjectURL(file) {
	var url = null;
	if(window.createObjectURL != undefined) { // basic
		url = window.createObjectURL(file);
	} else if(window.URL != undefined) { // mozilla(firefox)
		url = window.URL.createObjectURL(file);
	} else if(window.webkitURL != undefined) { // webkit or chrome
		url = window.webkitURL.createObjectURL(file);
	}
	return url;
}

调用时如下：

        <script src="js/uploadImg.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			imgUpload({
				inputId:'file', //input框id
				imgBox:'imgBox', //图片容器id
				buttonId:'btn', //提交按钮id
				upUrl:'',  //提交地址
				data:'file1' //参数名
			})
		</script>