Question

我有两个并行的AJAX调用，第一个boost()执行一些文本处理大约需要20秒。第二个progress()应该在第一次AJAX调用完成之前更新进度。

$。when（）允许我运行并行的AJAX调用，但只有在两个AJAX调用完成时才会输出响应。

我想同时启动两个AJAX调用，而boost()运行时，progress()应该每秒输出一次进度。

这就是我到目前为止所得到的，但progress()仅在boost()完成后输出：

$('#booster').on('click', function(e){
  e.preventDefault();
  $.when( boost() ).then( progress() );
});

function progress() {
  setInterval(function() {
    $.get('/progress.php', function(prog){
      $('#progress').html(prog);
    });
  }, 500);
}

function boost() {
  $.ajax({
    type: 'POST',
    url: '/boost.php',
    dataType: 'json',
    data: {
      id: id,
      task: 'boost'
    }, success: function(data) {
      ...
    }
  });
}

Answer 1

因为您使用的是$ .when，这是导致progress调用后boost运行的原因。它与将其置于success方法中相同。

相反，要像Cristy提到的那样将两个调用放在一起，因为它已经是异步，然后在成功回调中只是清除间隔。

var interval = null;

$('#booster').on('click', function(e) {
  e.preventDefault();
  boost();
});

function boost() {
  interval = setInterval(function() {
    $.get('/progress.php', function(prog) {
      $('#progress').html(prog);
    });
  }, 500);

  $.ajax({
    type: 'POST',
    url: '/boost.php',
    dataType: 'json',
    data: {
      id: id,
      task: 'boost'
    },
    success: function(data) {
      clearInterval(interval);
    }
  });
}

如何在Jquery中运行多个并行AJAX调用，而不必等到所有AJAX调用完成

1 个答案: