将 jQuery off() 应用于一个表列答案

【问题标题】：Apply jQuery off() to one table column将 jQuery off() 应用于一个表列
【发布时间】：2012-11-30 19:49:22
【问题描述】：

我将 jQuery on() 应用于每个表格行。用户点击任意一行后，另一个页面开始加载：

table_tag.on("click", "tbody tr", function(event) {                
    var search_id = datatable.fnGetData(this)[0];                                
    if(event.ctrlKey) {                                                                                        
        window.open("/search/"+search_id+"/");
    } else {
        window.location.assign("/search/"+search_id+"/");
    }
});

我在表格中添加了一个新列。它的每个单元格只有一个复选框：

<td><input type="checkbox" /></td>

在用户单击此复选框后，我需要阻止加载另一个页面。我试过这个：

table_tag.off("click", "tbody tr td input:parent")

但它不起作用。我该怎么做？

【问题讨论】：

您正在绑定到 tr，但关闭了绑定到 td 的点击

标签： jquery html-table cell

【解决方案1】：

"tbody tr td input:parent" 上没有处理程序。你只有一个处理程序，"tbody tr"。

相反，要更加小心绑定到的内容："tbody tr :not(input:checkbox)" 应该更好。

编辑：正如 popnoodles 所说，问题尚不清楚。以上是为了防止在用户单击复选框时加载新页面（否则我认为该复选框有些无用）。如果您的目的是在单击设置了复选框的行时禁止打开新页面，这是对我可以看到的问题的另一种解释，则将上述补丁应用于您的选择器，并从内部检查复选框状态处理程序。

EDIT2：缺少冒号出现错误； not(...) 不正确，应该是:not(...)。

编辑过多：Fiddle，tbody tr td:not(:has(input:checkbox))。

【讨论】：

他说他试过了：table_tag.off("click", "tbody tr td input:parent").
@JSuar：没错。而且他没有table_tag.on("click", "tbody tr td input:parent")。您无法删除您没有的处理程序。
表格中的每一行都有输入复选框元素作为第一个单元格。当用户仅单击此复选框时，我需要阻止新页面加载。当他点击其他行元素页面时必须更改。我的意思是。
@user1459172：那么是的，只需按照上述更改on() 选择器，以限制处理程序在复选框上激活。
我试过了，但点击所有行空间后页面不会更改为另一个，不仅是复选框。

【解决方案2】：

目前您正在尝试从 td 中删除点击事件，但您已将其应用于 tr。

对于您要达到的目标是模棱两可的。您要么只尝试做一次，在这种情况下使用 one()

table_tag.one("click", "tbody tr", function(event) {   ...

或者您不希望复选框的单击冒泡并触发对 tr 的单击

table_tag.on("click", "tbody tr", function(event) { 
     if (this.target!=event) return; // will ONLY catch the tr being clicked
     ...

或者其他的

【讨论】：