如何在Jquery中防止多个绑定到同一选择器？

当document.ready绑定时，单击.post。当通过ajax加载更多内容时，我使用回调函数绑定新帖子。这使得旧的帖子不能正常工作

show_hide_posts有一个简单的hasClass来检查点击后是否应该显示/隐藏帖子。加载新帖子后，hasClass检查在旧帖子上失败，但在新帖子上仍然有效

$(".post").on("click",show_hide_posts);

 //Callback function from third-party ajax plugin
 $.fn.almComplete = function(alm){

      $(".post").on("click",show_hide_posts);

 }

---

我认为这种行为是由于多次投标同一个选择器造成的？还是我遗漏了什么？

你是对的，当对象已经附加时，不应该使用范围广泛的事件处理程序。仅为新创建的对象关联click事件，或使用.off关闭现有对象的处理程序并使用.on重新附加。没错，当对象已附加时，不应使用范围广泛的事件处理程序。如果使用jQuery 1.7+，则仅为新创建的对象关联单击事件，或使用.off关闭现有对象的处理程序，并使用.on重新连接：

function show_hide_posts(){

e.preventDefault();

if(!$(this).hasClass('closed')){

   //hide post
   $(this).addClass("closed");

}else{

   //show post
   $(this).removeClass("closed");

}

}

如果没有：

$('.post').off('click', show_hide_posts) // remove handler
          .on('click', show_hide_posts); // add handler

编辑：
在这种情况下，我喜欢使用livequery，请看一看

如果使用jQuery 1.7+：

function show_hide_posts(){

e.preventDefault();

if(!$(this).hasClass('closed')){

   //hide post
   $(this).addClass("closed");

}else{

   //show post
   $(this).removeClass("closed");

}

}

如果没有：

$('.post').off('click', show_hide_posts) // remove handler
          .on('click', show_hide_posts); // add handler

编辑：
在这种情况下，我喜欢使用livequery，请看一看

我认为这种行为是由于多次投标同一个选择器造成的？还是我错过了什么

是的，您多次绑定

假设您有以下HTML：

$('.post').livequery(function () {
    $(this).on('click', show_hide_posts);
})

所以现在

A

和

B

有一个点击处理程序。然后将ajax/更新html为：

$(".post").on("click",show_hide_posts);

现在

A

和

B

有两个处理程序，而

C

和

D

有一个

当document.ready绑定时，单击.post。当通过ajax加载更多内容时，我使用回调函数绑定新帖子。这使得旧的帖子不能正常工作

正确，因此解决方案不是绑定到

。直接发布
：

$(".post").on("click",show_hide_posts);

这适用于任意数量的动态添加的帖子，并且
.post
中的所有
.post
都有一个单独的处理程序，并且不需要再次调用

杂项说明：

您很可能不应该这样做：

$('.posts').on('click', '.post', show_hide_posts);

这会引起很多问题

您还可以替换：

e.preventDefault();

与：

我认为这种行为是由于多次投标同一个选择器造成的？还是我错过了什么

是的，您多次绑定

假设您有以下HTML：

$('.post').livequery(function () {
    $(this).on('click', show_hide_posts);
})

所以现在
A
和
B
有一个点击处理程序。然后将ajax/更新html为：

$(".post").on("click",show_hide_posts);

现在
A
和
B
有两个处理程序，而
C
和
D
有一个

当document.ready绑定时，单击.post。当通过ajax加载更多内容时，我使用回调函数绑定新帖子。这使得旧的帖子不能正常工作

正确，因此解决方案不是绑定到
。直接发布
：

$(".post").on("click",show_hide_posts);

这适用于任意数量的动态添加的帖子，并且
.post
中的所有
.post
都有一个单独的处理程序，并且不需要再次调用

杂项说明：

您很可能不应该这样做：

$('.posts').on('click', '.post', show_hide_posts);

这会引起很多问题

您还可以替换：

e.preventDefault();

与：

在绑定处理程序之前，可以使用
.off（）
删除所有处理程序。是否使用事件委派？这样，您就不必每次添加更多内容时都重新绑定它。您可以在绑定之前使用
.off（）
删除所有处理程序。是否使用事件委派？这样，您就不必每次向添加更多contentAttaching事件时都重新绑定它。post不会将该事件应用于未呈现的对象。将事件附加到.post不会将该事件应用于未呈现的对象。我很久以前使用过livequery，我认为最新版本的jquery不需要它，我认为应该在添加这些对象时绑定它们。ajax返回数据，使用数据构造标记，将其分配给变量，追加变量，将单击事件添加到变量。我通常就是这样做的。很久以前我使用livequery，我认为最新版本的jquery不需要它。我认为您应该在添加这些对象时绑定它们。ajax返回数据，使用数据构造标记，将其分配给变量，追加变量，将单击事件添加到变量。我就是这么做的。天啊，我搞砸了。这显然是正确的答案。虽然@Victor answer也可以工作，但这似乎比每次加载更多帖子时绑定和解除绑定更符合逻辑。为什么我不应该使用e.preventDefault（）？除非你绑定到一个锚（
），否则它不是真的需要。天啊，我搞砸了这个。这显然是正确的答案。虽然@Victor answer也可以工作，但这似乎比每次加载更多帖子时绑定和解除绑定更符合逻辑。为什么我不应该使用e.preventDefault（）？除非您绑定到锚点（
），否则实际上并不需要它。