禁用表格列单击事件，但列中有锚标记

Question

我正在使用 jqGrid 来显示用户列表。当我单击任何列时，第一列中显示的复选框会被选中。

所以要禁用此功能。我已经实现了以下内容并写在gridComplete事件中，这在某些场景下运行良好。

$('table#user_entries tr td:not(":first-child")').click(function(e) {
      e.preventDefault();
      return false;
});

但它不允许我点击任何列中的链接。请提出建议，如何防止所有不包含锚标记的列的点击事件。

根据我选择显示的布局，表格中的列数是可变的。

我认为 jqGrid 没有任何问题。好像我可以假设它是一个普通的 html 表，我正在寻找一个类似的解决方案：

$('table#user_entries tr td:not("containing any anchor tag")').click(function(e) {
  e.preventDefault();
  return false;
});

Answer 1

如果我正确理解您的问题，您使用multiselect: true，并且您需要防止在单击其他列时选择行作为“多选”列。换句话说，你只需要改变 jqGrid 的行为。 防止click 事件不是目标。

我在the old answer 中描述了如何实现所需行为的方式。只是为了评论答案中的代码。 jqGrid 在<table> 元素上已经有一个 点击处理程序。在每个单元格上注册click 处理程序更有效。网格体将在排序或其他网格刷新时重建。所以你写道，你在grigComplete/loadComplete 中注册了click 处理程序。没那么有效。

事件冒泡允许处理对每个子元素的点击，而无需在每个子元素上注册事件处理程序。在处理click 事件期间 jqGrid "ask" beforeSelectRow 回调是否应跟随选择行。因此，您可以决定哪些点击跟随行选择，哪些不跟随。 e.target 是被点击的元素。构造 $.jgrid.getCellIndex($(e.target).closest("td")[0]) 为您提供单击列的索引。 cm[i].name 是单击列的名称。多选列将由 jqGrid 创建，它的名称始终为“cb”。所以代码

beforeSelectRow: function (rowid, e) {
    var $self = $(this),
        $td = $(e.target).closest("td"),
        iCol = $.jgrid.getCellIndex($td[0]),
        cm = $self.jqGrid("getGridParam", "colModel");

    return (cm[iCol].name === "cb");
}

仅在单击多选列的单元格时才允许选择行。

The corresponding demo 展示了结果。代码获取 Web 浏览器的最少资源并且不改变网格任何单元格上单击事件的任何行为是很重要的，因此它没有副作用。

Answer 2

尝试检测点击的 td 内是否有锚点，如下所示： JSFidle

$('table#user_entries tr td').click(function(e) {
    var linkExists = $(this).find('a').length;

    if (linkExists !== 0) {
         e.preventDefault();               
    } 
})