jquery - 控制 jQuery 异步 ajax 调用次数？

Question

如何控制允许多少个异步 ajax 调用？比方说，如果我将此限制设置为 3，则第 4 个请求将排队，直到 3 个请求之一完成。

注意：执行 ajax 调用的代码会动态插入到我的页面中，我无法控制哪个函数会发出请求。

Answer 1

也许尝试这样的事情。抱歉，我没有方便的站点进行测试。

$.queueAjax = (function() {

  var queue = [];
  var maxConnections = 4;
  var running = 0;

  function flush() {
    while (running < maxConnections && queue.length) {
      running += 1;
      var args = queue.shift();
      var xhr = $.ajax.apply($, args);
      xhr.done(function() {
        running -= 1;
        flush();
      });
    }
  }

  return function() {
    var args = Array.prototype.slice(arguments);
    queue.push(args);
    flush();
  }
})();

你会像你一样调用它，$.ajax但它会缓冲请求并且只允许 4 个同时运行。

如果您不想使用单独的函数，也可以替换主 jQuery 函数，但这很丑陋。像这样的东西：

$.ajax = (function() {
  var ajax = $.ajax;

  var queue = [];
  var maxConnections = 4;
  var running = 0;

  function flush() {
    while (running < maxConnections && queue.length) {
      running += 1;
      var args = queue.shift();
      var xhr = ajax.apply($, args);
      xhr.done(function() {
        running -= 1;
        flush();
      });
    }
  }

  return function() {
    var args = Array.prototype.slice(arguments);
    queue.push(args);
    flush();
  }
})();

Answer 2

既然你说你不能使用任何插件，这是我能想到的，但不能保证效率。

var ajax_calls = new Array(); //全局变量

if( ajax_calls.length < 3 ){
    ajax_calls.push( 
        jQuery.ajax({
            url: "target.php",
            type: "POST", //or GET
            data: {varname: "value"}
            }) 
        );
}

然后稍后，您可以在成功时删除相应的ajax控制器。