javascript - Jquery - 按顺序循环ajax

Question

所以我有一系列需要更新的东西，但由于 async:false 已被弃用，它需要一个一个地显示更新进度，有什么方法可以用 ajax.success 做到这一点, 例子:

progressUpdate(stuff[0].name, 100 / stuff.length)
for(var f = 0; f < stuff.length; f++){

  $.ajax({
    type: "PUT",
    global: true,
    url: '/stuffs/'+stuff[f].id+'.json',
    contentType: 'application/json', 
    dataType: 'script', 
    data: JSON.stringify({stuff:{set: 1}, _method:'put'})
  });


  //Wait here to finish updating, then continue increase the progressbar

  progressUpdate(stuff[f].name, 100 / stuff.length)     
}

我尝试将 progressUpdate() 放在 success 中，但不是按照数组的顺序，因为它在收到回调时更新，一些后元素在前一个元素之前完成，就像这样

....
.success: funcion(){
  progressUpdate(stuff[f].name, 100 / stuff.length)
}
....

有什么办法可以按顺序进行这个进程吗？

Answer 1

这个呢？

do_job(stuff, 0); // Launch first job

function do_job(stuff, index) {
  if (index < stuff.length)
  {
    $.ajax({
      type: "PUT",
      global: true,
      url: '/stuffs/'+stuff[f].id+'.json',
      contentType: 'application/json', 
      dataType: 'script', 
      data: JSON.stringify({stuff:{set: 1}, _method:'put'}),
      success: function(data) {
        // Job finished, let's begin the next one
        progressUpdate(stuff[index].name, 100 / stuff.length)   
        do_job(stuff, index + 1); // actual index (your variable "f") + 1
      }
    });
  } else {
    // every stuff is finished
  }
}