如何通过 JQuery 检查页面上是否正在运行任何 AJAX 请求？

Question

有什么方法可以找到页面上正在运行的任何 AJAX 请求（在 $(window).load 事件上）？

我想在所有 ajax 请求完成后应用一些事件。

我试过了

.ajaxStop(function(){ })

但是当页面上存在 AJAX 请求时，我想放置这个块（ajaxstop）。

任何帮助将不胜感激。

Answer 1

把这个放在开头：

var ajax_running = false;
$(document).ajaxStart(function() {
  ajax_running = true;
});

然后你可以稍后使用：

$(document).ready(function() {
  if (ajax_running) {
    $(document).ajaxStop(function() {
      // do something
    })
    ajax_running = false;
  }
});

Answer 2

您可以这样做，它会创建一个函数来告诉您有多少活动请求处于待处理状态。

const activeAjaxRequests = (function(send) {
    var active_requests = 0;
    XMLHttpRequest.prototype.send = function(body) {
        active_requests++;
        this.addEventListener("readystatechange", function() {
            if(this.readyState === 4) active_requests--;
        });
        send.call(this, body);
    };
    return ()=>active_requests;
})(XMLHttpRequest.prototype.send);

var active_requests = activeAjaxRequests();

console.log(`There are currently ${active_requests} active ajax requests.`);

Answer 3

确保这个函数是加载到浏览器的第一件事：

(function(open) {

    XMLHttpRequest.prototype.open = function(method, url, async, user, pass) {

        this.addEventListener("readystatechange", function() {
            //Put your code here
        }, false);

        open.call(this, method, url, async, user, pass);
    };

})(XMLHttpRequest.prototype.open);

每次检索 ajax 响应时，都会调用以下侦听器函数，并在其中放置您的代码：

this.addEventListener("readystatechange", function() {
    //Put your code
}, false);

注意： 这段代码是从 this answer 中提取的，它用于拦截所有 ajax 请求，而从 this answer 中你不需要在函数上传递参数：

(function(open) {
    XMLHttpRequest.prototype.open = function() {
        this.addEventListener("readystatechange", function() {
            // put your code here!
        }, false);
        open.apply(this, arguments);
    };
})(XMLHttpRequest.prototype.open);