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

下面一段代码给大家分享jquery上传多种图片带进度条样式，具体代码如下所示：

xhr2

0

OK

function xhr2() {

var xhr = new XMLHttpRequest();//第一步

//定义表单变量

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

//console.log(file.length);

//新建一个FormData对象

var formData = new FormData(); //++++++++++

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

//追加文件数据

for (i = 0; i < file.length; 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) {

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

var progress = 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('请求超时！');

}

}

以上所述是小编给大家介绍的关于jQuery上传多张图片带进度条样式，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

时间： 2017-03-01