Question

我一直在玩Ajax和jQuery来生成一个菜单，当用户点击＆＃34;显示更多＆＃34;时，会显示我商店中排名前10的项目。菜单向下滑动，显示更多类别。

＆＃34;显示更多＆＃34;文本被称为＆＃34;按钮＆＃34;显示的结果称为＆＃34;结果＆＃34;。

以下是相关代码：

<script> 
$(document).ready(function(){

  $("#button").on("click",function(){
    $("#results").slideToggle("slow");

  });

});
</script>

当我点击其中一个类别来优化结果时它工作正常，当我点击删除过滤器时会出现问题，＆＃34;更多＆＃34; toggleslide不再有效。我已经读过这篇文章了，我认为它是用来绑定和使用on（）

所以我尝试了以下但没有成功。

<script> 
$(document).ready(function(){

  $("#button").live("click",".button",function(){
    $("#results").slideToggle("slow");

  });
    });
    </script>

和

<script> 
$(document).ready(function(){

  $("#button").on("click",".button",function(){
    $("#results").slideToggle("slow");

  });
    });
    </script>

我显然喜欢修复，但如果有人也可以解释为什么这不起作用，这对我的学习jQuery / AJAX非常有帮助

提前致谢克里斯

Answer 1

JavaScript的on语法需要一个选择器，然后是一个容器：

$('selector').on('click', 'container', function(){...

.button是#button的父级吗？

$(document).on('click', '#button', function(){可能就是您所追求的目标。

jQuery toggleslide在ajax刷新后无法正常工作

1 个答案: