OnClick在表行上-除了锚

OnClick on table row - Except on Anchor

本文关键字:OnClick      更新时间:2023-09-26

我有一个表,其中有以下事件:

$("#tp-active-list-table td").click(function () {
    var transactionNbr = parseInt($(this).parent("tr").children('td.td-transaction-nbr').html());
    DoSomething(transactionNbr);
});

它工作得很好,基本上它调用DoSomething和从各自的td收集的Number

但是我确实有一个问题,因为在一个td s中我有一个锚,如果在该锚上执行单击,那么DoSomething将运行,并且页面将正确导航到另一个URL。

无论如何检查点击是否在anchor上以避免运行DoSomething功能?

使用event.stopPropagation()来防止事件冒泡

$('td a').click(function (e) { 
    e.stopPropagation()
});

其他选项为:e.target.tagName

$("#tp-active-list-table td").click(function (e) {
    if(e.target.tagName.toLowerCase() === 'a'){
            var transactionNbr = parseInt($(this).parent("tr").children('td.td-transaction-nbr').html());
            DoSomething(transactionNbr);
    }
});

传递给处理程序函数作为第一个参数的对象具有target属性,如果target.tagName == 'a'则单击锚

我认为Shaunak的回答非常有效。为了指出另一种方法,在单击事件上,您可以检查是否存在悬停的a标记。http://jsfiddle.net/Zx7S5/

$("#tp-active-list-table td").click(function(event) {
    if($(this).find("a:hover").length <= 0) {
       /* ..... */
    }
});