Question

我有一个html表，其中行和列是动态添加的。

创建动态行

var row = tableHolder.insertRow(0);
row.id = "row_0";

创建一个单元格

var cell = row.insertCell(0);
cell.id = "cell_0"

现在我需要在动态创建的行上附加一个click事件。

row.addEventListener('click', function(evnt) {
    openPopup();    
}, false);

点击该行时会打开一个弹出窗口。

现在我希望当用户点击每一行的第一个单元格时，不应该触发click事件，弹出窗口也不会打开。

Answer 1

您可以在jquery中使用：gt选择器在其他行上添加click事件。

查看以下链接： http://api.jquery.com/gt-selector/

Answer 2

如果你有一个id="mytable"的表，那么你可以使用jQuery的on()方法来监听表中发生在除每行中第一个单元之外的任何单元格上的事件。绑定到表的原因是动态创建的行仍将触发事件（因为事件将冒泡到表中）。

// Listen for click event on anything but first cell in each row within #mytable
$('#mytable').on('click', 'td:gt(0)', function() {
    alert('Got click on anything but the first cell');
});

// Dynamically create row for demonstration
$('#mytable').append('<tr><td>Cell 1</td><td>Cell 2</td></tr>');

这是一个小提琴：jsfiddle 单击单元格1，您将看不到任何事件被触发，单击第二个单元格，将出现警报。

Answer 3

试试这个JQuery解决方案

$('table tr td:not(:first-child)').click(function () {
        openPopup();
});

单击第一个单元格以外的表格行

3 个答案: