我有一个 jQuery 函数，可以在元素循环中的每个元素上显示隐藏内容。这工作完美，但问题是，当我将新元素添加到循环中时，它停止工作。它实际上适用于某些元素，但不适用于其他元素(奇怪的行为)。
<script type="text/javascript">
jQuery(document).ready(function($) {
$(".see_all").click(function(){
if ($(this).next().css('display') == 'none'){
$(this).next().show();
}
else
if($(this).next().is(':visible')){
$(this).next().hide();
}
});
})
</script>
我的 jQuery 代码有问题吗？如何使其适用于新附加的元素和先前显示的元素。
HTML 代码
<div class="center_container">
<%for users in @user%>
<div class="see_all">
<span style="color:#808080;cursor:pointer">See All Reviews(<%=@beep_count= (@beep.opposes.count + @beep.neutrals.count + @beep.supports.count)%>)</span>
</div>
<div style="display:none;" class="hidden">
No reviews available
</div>
<%end%>
</div>
最佳答案
这仅在您使用 jQ 1.7+ 时才有效。如果你不是，看看 jQuery 的 delegate method ，这将在 jQuery < 1.7 中实现相同的效果。不过，没有理由不使用最新版本:)
这是因为当您绑定(bind)点击处理程序时:
$(".see_all").click()
它仅绑定(bind)到与选择器.see_all匹配的当前元素。
要解决这个问题，您可以使用 jQuery 的 on() 进行委托(delegate):
$("body").on("click", ".see_all", function() {
//do stuff
});
此处理程序绑定(bind)到 body，然后当它检测到单击时，它将查看单击的元素是否与选择器 .see_all 匹配。如果是，它将执行该函数。因为它绑定(bind)到 body，所以如果新的 .see_all 元素也插入到 DOM 中，这将起作用。
如果所有 .see_all 都包含在一个 div 中，请使用它来委托(delegate)而不是 body - 仅用作示例。委托(delegate)包含所有 .see_all 元素的第一个事物。
顺便说一句，您应该使用新的 API .on() 和 .off() 进行事件绑定(bind)，从 1.7 开始它们已成为首选方法。 Documentation for .on() .
关于javascript - 为什么 jQuery 不能处理附加内容？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12053656/