jQuery上传多张图片带进度条样式（DEMO）

functionxhr2() {

varxhr =newXMLHttpRequest();//第一步

//定义表单变量

varfile = document.getElementById('file').files;

//console.log(file.length);

//新建一个FormData对象

varformData =newFormData();//++++++++++

formData.append("enctype","multipart/form-data");

//追加文件数据

for(i = 0; i

formData.append("file["+ i +"]", file[i]);//++++++++++

}

//formData.append("file", file[0]); //++++++++++

//post方式

xhr.open('POST','/common/doUpload');//第二步骤

xhr.upload.onprogress =function(event) {

if(event.lengthComputable) {

varcomplete = (event.loaded / event.total * 100 | 0);

varprogress = document.getElementById('uploadprogress');

progress.value = progress.innerHTML = complete;

}

};

//发送请求

xhr.send(formData);//第三步骤

//ajax返回

xhr.onreadystatechange =function() {//第四步

if(xhr.readyState == 4 && xhr.status == 200) {

console.log(xhr.responseText);

}

};

//设置超时时间

xhr.timeout = 100000;

xhr.ontimeout =function(event) {

alert('请求超时！');

}

}