ajax异步上传图片，话不多说，直接上代码
multiple="multiple" 这个是为了能选多个文件，否则只能选一个文件。
这里由于本人太懒，没有做图片回显或预览，有需要的可以自己补充哈
<li class="clear">
<span>批量上传图片 :</span>
<div class="fileImg">
<input type="file" value="" multiple="multiple" name="files" accept="image/jpg,image/jpeg,image/png,image/gif,image/bmp"/>
<input type="hidden" value="" class="other" name="otherimg" />
</div>
</li>
js代码
function upload(form){
var otherimg = '';
var bbb = form.files;
for (var i=0;i<bbb.length;i++){
//这里多个图片不知道怎么一起提交到后台，有大神了解可以教一下，我这里只好用循环的方式去做上传多个图片
var formData = new FormData();
console.log(bbb);
formData.append('files', bbb);
$.ajax({
url: "<%=path%>/api/file/upload.do",
type: "POST",
data: formData,
/**
*必须false才会自动加上正确的Content-Type
*/
async: false, //请求设为同步，不然不等上传完就走回调函数，提示上传失败了
contentType: false,
/**
* 必须false才会避开jQuery对 formdata 的默认处理
* XMLHttpRequest会对 formdata 进行正确的处理
*/
processData: false,
dataType: 'json',
success: function (data) {
otherimg += data.data+",";
},
error: function () {
alert("上传失败！");
}
});
}
console.log(otherimg);
$(".other").val(otherimg); //最后把拼接好的值赋值给表单隐藏域，以便提交到后台
}
此方法测试上传速度还不是很慢，几十张图也是分分钟搞定。要求不高，能用就行，哈哈
---------------------
作者：十三亿少女的梦
来源：CSDN
原文：blog.csdn.net/qq_38187437…
版权声明：本文为博主原创文章，转载请附上博文链接！ |
|
