Question

所以我有几个div，其中发布了AJAX内容。所有AJAX完成时都会触发 ajaxComplete ，但我想知道哪些容器加载了新的AJAX内容。我正在使用它，但它不起作用。

$(document).ajaxComplete(function( event, xhr, settings ) {
   // loadedDOM is one of the containers where AJAX result is posted on
   var loadedDOM=xhr.responseText.parent();
});

了解新装载AJAX结果的容器的最佳方式是什么。

Answer 1

我有几个div，其中发布了AJAX内容......

Ajax 从服务器加载某些内容，它不会在任何地方发布任何内容。 ajaxComplete调用不会特定于任何容器div，因为，没有任何容器。

如果您正在使用load method，这是一个简写方法，它执行ajax调用然后将结果放入给定的容器中，有关它放置的容器的信息in不会传播到ajaxComplete（至少不会传播到the documentation）。您需要将这些load电话转换为单独的ajax和text / html电话（请参阅load文档中的详细信息）并执行某些操作你自己传递这些信息，或编写你自己的load包装器，它使用load的完整处理程序来传递这些信息。

重新评论：

是否像一般的过度拱形侦听器，它将捕获所有载荷并找出哪些载荷被加载？

不是我知道的。您可以创建自己的特殊load函数并启动自定义事件，然后在document级别处理该自定义事件：

添加我们自己的“load with event”功能（一次）：¹

jQuery.fn.loadWithEvent = function() {
    var t = this;
    t.load.apply(t, arguments).then(function() {
        t.trigger(jQuery.Event("ajaxload"));
    });
};

为该事件添加一般处理程序（一次）：

$(document).on("ajaxload", function(e) {
    // Here, e.target is the element it was fired on
    console.log("got it on document", e.target);
});

使用它（根据需要经常使用）：

$("#target").loadWithEvent("/some/url");

¹如果您使用的是ES2015（又名“ES6”），loadWithEvent功能可以更简单一些：

jQuery.fn.loadWithEvent = function(...args) {
    this.load(...args).then(() => {
        this.trigger(jQuery.Event("ajaxload"));
    });
};

什么容器受ajaxComplete的影响

1 个答案: