如何使用 jQuery 的 $.when() 正確處理延遲數組？

在$.when() 中處理延遲數組

使用延遲承諾數組時，了解如何處理它們非常重要將它們傳遞給$.when() 時。在本文中，我們將深入研究 $.when() 無法正確處理 Deferred 陣列的問題，並提供解決方案。

問題

考慮以下程式碼：

function getSomeDeferredStuff() {
  var deferreds = [];

  for (i = 1; i <= 10; i++) {
    var count = i;

    deferreds.push(
      $.post('/echo/html/', {
        html: '<p>Task #' + count + ' complete.',
        delay: count
      }).success(function(data) {
        $("div").append(data);
      }));
  }

  return deferreds;
}

$(function() {
  $("a").click(function() {
    var deferreds = getSomeDeferredStuff();

    $.when(deferreds).done(function() {
      $("div").append('<p>All done!</p>');
    });
  });
});

在此範例中，「全部完成！」應在所有延遲任務完成後出現。但是，$.when() 無法將Deferreds 數組識別為單一實體，從而導致“全部完成！”

解決方案

要將Deferred 數組傳遞給$ .when()，請使用Function.prototype.apply:

$.when.apply($, my_array).then( ___ );

函數接受一組參數並將它們應用於函數。例如：

$.when.apply($, deferreds).then(function() {
  $("div").append('<p>All done!</p>');
});

或者，在 ES6 中您可以使用擴充運算子：

$.when(...my_array).then( ___ );

以上是如何使用 jQuery 的 $.when() 正確處理延遲數組？的詳細內容。更多資訊請關注PHP中文網其他相關文章！