表重新加载 JQuery 后，全选复选框不再起作用

Question

我有一个包含一些产品的表格，并且在每个产品附近我都有一个复选框，该复选框的值是产品 ID。在页面顶部，我有一个全选复选框，它使用以下 jquery 函数选择/取消选择所有其他复选框：

$("#selectall").change(function(){
    $(".check").prop('checked', $(this).prop("checked"));
});

无论如何，我有一个“删除选定”按钮，可以从我的表格中删除选中的产品。此按钮在 ajax 函数中仅刷新我的表格，而不是整个页面，使用：

$("#prodTable").load( "../product #prodTable" );

我的问题是刷新表格后，“全选”复选框不再起作用。

Answer 1

您需要使用事件委托将事件附加到动态添加的 dom：

$("#prodTable").on('change','#selectall',function(){
 $(".check").prop('checked', $(this).prop("checked"));
});

Answer 2

$("#selectall").change(function(){
    $(".check").prop('checked', $(this).prop("checked"));
});

将上面的代码放在刷新表之后，因为它将该事件分配给动态添加的复选框。