html选择文件上传ajax,jquery – HTML5多文件上传：通过AJAX一个一个上传

为了进行同步操作，需要在最后一次完成时启动新的传输。例如，Gmail同时发送所有内容。

AJAX文件上传进度的事件是对原始XmlHttpRequest实例的进度或进度。

所以，在每个$ .ajax()之后，在服务器端(我不知道你将要使用什么)，发送一个JSON响应来在下一个输入执行AJAX。一个选项是将AJAX元素绑定到每个元素，使事情变得更容易，所以你可以在$(this).sibling(‘input’)。execute_ajax()的成功中做到这一点。

这样的东西：

$('input[type="file"]').on('ajax',function(){

var $this = $(this);

$.ajax({

'type':'POST','data': (new FormData()).append('file',this.files[0]),'contentType': false,'processData': false,'xhr': function() {

var xhr = $.ajaxSettings.xhr();

if(xhr.upload){

xhr.upload.addEventListener('progress',progressbar,false);

}

return xhr;

},'success': function(){

$this.siblings('input[type="file"]:eq(0)').trigger('ajax');

$this.remove(); // remove the field so the next call won't resend the same field

}

});

}).trigger('ajax'); // Execute only the first input[multiple] AJAX,we aren't using $.each

上述代码将用于多个< input type =“file”>但不能为< input type =“file”multiple>在这种情况下，应该是：

var count = 0;

$('input[type="file"]').on('ajax',function(){

var $this = $(this);

if (typeof this.files[count] === 'undefined') { return false; }

$.ajax({

'type':'POST',this.files[count]),'success': function(){

count++;

$this.trigger('ajax');

}

});

}).trigger('ajax'); // Execute only the first input[multiple] AJAX,we aren't using $.each