从绑定元素的子元素中删除事件处理程序

Question

我想将单击处理程序应用于表中的行：

var myTable = $(this);
myTable.on('expand', 'tr', myHandler);
myTable.on('click', 'tr', function () {
    $(this).trigger('expand');
});

function myHandler(e) {
    // my action
}

这是一个非常简化的版本，但它会触发一个扩展行的 jQuery 方法。我想根据特定行的内容从特定行中删除此处理程序。我有一个每次单击该行时都会触发的函数。如果它与设置的条件不匹配，则会触发一个方法，显示一条消息，通知用户该问题。我现在想禁用该行的单击展开。

function stopFunction(row) {
    row.find('th[scope=row]').parents("#tableID").off('expand', 'tr', myHandler);
}

上面只是删除了所有行中的单击以展开功能的操作。我不知道如何允许单击其他行，但只是从这个单个表行中删除处理程序。请注意，row.find('th[scope]') 是该行的表格单元格，该行的第一个父级是该行，然后该行的父级是该表（@tableID ）。

Answer 1

function stopFunction(row) {
    row.on("click", function (e) {
        e.stopPropagation();
    });
}

概念证明。

Answer 2

正如您所发现的，您的 .off 调用将关闭整个事件处理程序。这是因为，使用 on （这是一种很好的做法），您只有一个事件处理程序，它响应所有匹配的元素（在您的情况下是 tr ）。

我建议您改为使用类来执行此操作。将类 no-expand 添加到那些不应扩展的 tr 中，并改用此事件处理程序：

myTable.on('click', 'tr:not(".no-expand")', function() { ... })

function stopFunction(row) {
  row.addClass("no-expand");
}