Select table 重新加载 JQuery 后，所有复选框不再有效

Question

我有一个 table 和一些产品，在每个产品附近我都有一个复选框，它的值是产品 ID。在页面顶部，我有一个 Select 所有复选框，其中 selects/deselects 所有其他复选框使用以下 jquery 函数：

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

无论如何，我有一个 "Delete selected" 按钮可以从我的 table 中删除选中的产品。此按钮仅刷新我的 table，而不刷新整个页面，在 ajax 函数中，使用：

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

我的问题是，在我刷新 table 后，"Select All" 复选框不再起作用。

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"));
});

刷新后放置上面的代码 table 因为它将事件分配给动态添加的复选框。

Select all checkbox doesn't work anymore after table reload JQuery