如何使用 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中文网其他相关文章！