javascript - 如何等待 jQuery ajax 请求循环完成？

Question

我有那个代码:

for (var i = 0; i < $total_files; i++) {
  $.ajax({
    type: 'POST',
    url: 'uploading.php',
    context: $(this),
    dataType: 'json',
    cache: false,
    contentType: false,
    processData: false,
    data: data_string,
    success: function(datas) {
      //does something
    },
    error: function(e) {
      alert('error, try again');
    }
  });
}

它可以很好地上传图片，但问题是我找不到一种方法来一张一张地上传图片，我尝试将选项设置为 async to false 但它卡住了网络浏览器直到所有图片都上传完，这不是我想要的，我想以某种方式模拟这个“async : false”选项来执行同样的事情，但不会卡住网络浏览器。

如何做到这一点？

Answer 1

您可以创建一个 promise 数组，这样一旦所有 promise 都得到解决，您就可以运行您的all done代码。

var promises = [];
for (var i = 0; i < $total_files; i++){ 
   /* $.ajax returns a promise*/      
   var request = $.ajax({
        /* your ajax config*/
   })

   promises.push( request);
}

$.when.apply(null, promises).done(function(){
   alert('All done')
})

DEMO