Question

对于选中的每个复选框，我需要执行一个在每个循环内处理的AJAX请求。当所有AJAX请求完成后，我需要执行一个后续功能。

复选框的数量总是可变的，如果选中此框，我只需要运行AJAX。

HTML：

<input type="checkbox" class="checkbox" val="1" />
<input type="checkbox" class="checkbox" val="2" />
<input type="checkbox" class="checkbox" val="3" />
<input type="checkbox" class="checkbox" val="4" />
<input type="checkbox" class="checkbox" val="5" />

<button id="btn1">Click Me</button>

jQuery（v2.1.4）

$(document).on('click', '#btn1', function() {
    $('.checkbox').each(function() {
         // We only want the checked boxes
   if ($(this).is(':checked')) {
             // Do the thing
             $.get('test.html', function(data) {
                 console.log('Response received: ' + $(this).val());
             });
         }
    });
    console.log('All responses received');
});

在完成所有AJAX请求之前，我可以使用什么来延迟最终回调（＆＃34;收到所有响应＆＃34;，在本例中）？

JSFiddle：https://jsfiddle.net/sjkhh43x/

Answer 1

创建每个$.get返回的promises数组，并在所有已解析时使用$.when运行代码

$(document).on('click', '#btn1', function() {
  var promises = $('.checkbox:checked').map(function() {
    var $input = $(this)
    return $.get('data.html', function(data) {
      console.log('Response received: ' + $input.val());
    });
  }).get();

  $.when.apply(null, promises).done(function() {
    console.log('all done')
  })

});

的 DEMO

将.each（）与AJAX一起使用，等待循环完成

1 个答案: