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

JQuery: How to refresh event handlers

本文关键字:刷新 事件处理 程序 何刷新 JQuery      更新时间:2023-09-26

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

  $('.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 () {....
  });

但是我认为一定有更好的方法…但是在我的搜索中什么也没有出现,因为我不确定这是在什么搜索条件下。

是否有一种方法可以命名细节控制事件并调用它,这样我就不必复制粘贴或重新连接或刷新处理程序了?

您正在寻找事件委托,这是在容器上附加处理程序并根据特定标准(在本例中为选择器)过滤冒泡事件的过程。假设.pagination.details-control的父级,并且父级永远不会被替换:

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

在处理程序上使用。

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

您可以使用on()和off()动态地打开和关闭这些