jQuery .on（）不能与PJAX一起使用？

Question

$("#img-switcher").on("switchImageEvent", function(event, triggerID){ 
    $(this).attr('src',triggerID); 
}); 
$("#page-container").on("click", "img.img-switcher", function() { 
    var newSRC = $(this).attr('src'); 
    $("#img-switcher").trigger("switchImageEvent", [newSRC]); 
}); 

这段代码似乎不适合我用PJAX。如果我最初加载一个页面，它会选择这些元素并做出更改。但是，只要我用PJAX转到另一页面，它就不会再选择.on（“click”）操作的元素。难道我做错了什么？我试图在var newSRC之前添加警报，以查看它是否正确地使用.on（）选择元素，但事实并非如此。有任何想法吗？

Answer 1

那么，因为只有这一点的代码脱离了上下文，我会假设你试图使用on作为live而不是使用它作为delegate。

pjax，使用xhr为了加载没有附加事件的元素可能是一个问题。

所以，我的建议是使用不重载的父元素并在其上附加事件。像这样，用最顶级的，没有重新加载的元素，而不是body：

$("body").on("switchImage", "#img-switcher", function(e, src){ 
    $(this).attr({ 'src': src }); 
}); 

$("body").on("click", "img.img-switcher", function() { 
    $("#img-switcher").trigger("switchImage", $(this).attr('src')); 
});