javascript - 收到 AJAX 响应时引发事件

Question

我想知道当我的网页收到任何 AJAX 响应时是否可以引发事件。我在 SharePoint 中工作，因此 Microsoft 使用很多 AJAX 将数据加载到 Web 部件中，我想在我的页面收到 AJAX 响应时引发一个事件，以便我可以检查数据是否已加载到 Web 部件中。任何帮助将不胜感激。

Answer 1

下面是包装全局 XMLHttpRequest 对象以记录所有 open()ed URL 的示例:

(function(){
  var ajaxOpen=window.XMLHttpRequest.prototype.open;
  window.XMLHttpRequest.prototype.open=function(m,u,a){
    this.addEventListener("load", function(){ console.log("ajax loaded", new Date(), m, u, a ); });
    return ajaxOpen.call(this,m,u,a);
  };
}());



$.get("/", function(e){
  console.log(e.length+" bytes fetched");
});

在此页面上运行时，会记录类似以下内容:

 ajax loaded Fri May 30 2014 09:56:34 GMT-0500 (Central Daylight Time) POST /posts/23957352/edit-submit/b4dd7272-6618-4c79-9810-e8ff71122b51 true 

请注意，jQuery 仅用于显示所有 ajax 调用都会受到影响，而无需修改特定库或现有代码。经过一些修改，这可以记录更多详细信息，例如数据、响应大小、调用持续时间等。

执行此操作会消耗少量 RAM，并且较旧的浏览器可能不喜欢弄乱“主机对象”，但这种代码风格非常适合调试、单元测试或性能分析。

编辑:我发现 ajax 确实允许使用 addEventListener() 多个事件处理程序(仅限现代浏览器)，因此上述代码现在记录实际响应。