Question

有没有办法监控在页面上使用JQuery进行的所有ajax请求，并使用每个请求的结果调用回调函数？

例如，我提出了我的ajax请求：

$.get('foo', {foo: bar} );
$.get('bar', {bar: foo} );

然后我每次完成任何ajax请求时都会调用一个函数，其中包含引用的url和请求的结果？

Answer 1

查看jQuery的“ajaxComplete”;它应该是你正在寻找的东西：

http://api.jquery.com/ajaxComplete/

使用它，您可以注册一个处理程序，并在每次ajax调用时调用该处理程序。

$.ajaxComplete(function() {
    alert('it worked');
});

$.get('foo', {foo: bar} ); // "it worked" would get alerted when this completes

要查看返回的响应，只需使用提供的XHR对象，如下所示：

$.ajaxComplete(function(e, xhr) {
    alert('it worked, and the response was:' + xhr.responseHTML);
});

$.get('foo', {foo: bar} );

要检查网址，您可以使用提供的第三个“设置”参数：

$.ajaxComplete(function(e, xhr, settings) {
    alert('it worked, and the response was:' + xhr.responseHTML);
    alert('and the original URL was:' + settings.url);
});

$.get('foo', {foo: bar} );

修改

正如Yusuf K.在评论中有用地指出的那样，如果你正在使用jQuery 3等jQuery的新版本之一，那么事情已经发生了变化。 ajaxComplete不再是静态方法，而是您在document上调用的实例方法：

$(document).ajaxComplete(function(e, xhr, settings) { // ...

Answer 2

使用url访问ajaxComplete的任何请求的示例...直接从文档中获取：

http://api.jquery.com/ajaxComplete/

$('.log').ajaxComplete(function(e, xhr, settings) {
  if (settings.url == 'ajax/test.html') {
    $(this).text('Triggered ajaxComplete handler. The result is ' +
                     xhr.responseHTML);
  }
});

如果您将console.log（）xhr和settings个对象添加到浏览器控制台，则可以在ajaxComplete

中查看您有权访问的所有数据

Answer 3

您可以将请求存储在数组中并使用链式回调，如果这是您的意思：

function callback( data ) {
  // do something with the request
}

var requests = [];
requests.push( $.get('foo', { foo: bar }) ); // add to array and run request
requests.push( $.get('bar', { bar: foo }) );

requests.forEach(function( request ) {
  request.done(function( data ) {
    callback( data );
  });
});

监控JQuery发出的所有AJAX请求？

3 个答案: