Question

我在jquery数据表中添加了一个新行，其中html内容（复选框输入）在某些事件中为：

$("#btn").on( 'click', function (){
    $('#mytable').DataTable().row.add([data[0],data[1],"<td><input type=\"checkbox\" value=\"\" /></td>"]).draw();
}

现在，当我点击＆＃39;复选框＆＃39;从动态创建的行中，整个行与复选框一起被触发。因此，下面甚至没有被触发：

$('input[type=checkbox]').on( 'click', function (e){
    e.stopPropagation();
});

但反过来会触发此事件：

$("#mytable tbody").on( 'click', 'tr', function (){
   $(this).addClass('selected').siblings().removeClass('selected');
 ....
}

知道为什么会这样吗？

Answer 1

您无法在委托事件处理程序上停止传播，因为它在处理之前已经通过DOM传播。

或者，您可以检查event.target点击处理程序中的tr，如果是单击的复选框，则不执行任何操作：

$("#mytable tbody").on('click', 'tr', function(e) {
    if (e.target.tagName.toLowerCase() == 'input')
        return;

    $(this).addClass('selected').siblings().removeClass('selected');
})

动态创建复选框单击事件选择整行，而不是仅选择jquery数据表中的复选框。这是为什么？

1 个答案: