Question

我有一个绑定到DOM元素的Jquery处理程序。

  $('.details-control').click( function () {
      var tr = $(this).closest('tr.parentRow');
      var row = table.row(tr);
      var nestedTable = tr.children('td.nested').children('table.nested').clone(true);


        if ( row.child.isShown() ) {
            // This row is already open - close it
            row.child.hide();
            tr.removeClass('shown');
        }
        else {
            // Open this row
            row.child(nestedTable).show();
            tr.addClass('shown');
        }
  });

上面的元素在一个分页表中，所以当表被分页时，页面上的（'.details-control'）元素会发生变化，而这些元素没有附加事件。

我希望将这些事件附加到这些新的$（'details-control'）元素上。

我能想到的唯一方法就是再次重写代码......

  $('.pagination').click( function () {
  //copy-paste $('.details-control').click( function () {....

  });

但我认为必须有一个更好的方法..但我的搜索中没有任何内容，因为我不确定这些搜索条件甚至可以解决。

有没有办法可以命名详细信息控制事件并调用它，因此我不需要复制粘贴或重新附加或刷新处理程序的方法？

Answer 1

您正在寻找事件委派，这是在容器上附加处理程序并根据特定条件（在本例中为选择器）过滤冒泡的事件的过程。假设.pagination是.details-control的父级，父级永远不会被替换：

$('.pagination').on('click', '.details-control', yourHandler);

Answer 2

使用处理程序。

$(document).ready(function() { 
    $( selector ).on('click', function () { 
        // logic 
     })
  })

您可以使用on（）和off（）

动态打开和关闭它们

JQuery：如何刷新事件处理程序

2 个答案: