jQuery单击不适用于ajax生成的内容

Question

我在用 $(".button").on("click", function(){ });

单击到容器上的按钮，但随后进行了ajax调用，并且内容用新内容进行了更新，然后当我尝试单击.button它时将不起作用...单击按钮时，什么也不会返回。

我什至试过

$(".button").live("click", function(){ });

要么

$(".button").click(function(){ });

我该如何运作？

编辑： 我的HTML：

<div class="container">

   <ul>

       <li>item1</li>

       <li>item2</li>

       <li>item3</li>

   </ul>

   <input type="button" value="reload" class="button" />

</div>

Answer 1

应该以这种方式完成。$('body').on('click', '.button', function (){&nbsp; &nbsp; &nbsp; &nbsp; alert('click!');&nbsp; &nbsp; });如果您的容器在ajax请求期间没有更改，则性能更高：$('.container').on('click', '.button', function (){&nbsp; &nbsp; &nbsp; &nbsp; alert('click!');&nbsp; &nbsp; });始终将委托事件绑定到将包含动态元素的最接近的静态元素。

Answer 2

好的，因为我缺少一个参数，所以可以通过正确使用.on（）函数解决我的问题。代替$(".button").on("click", function() { } );我用了$(".container").on("click", ".button", function() { } );