html中div中的onclick事件,javascript – html div onclick事件

问题是点击锚点仍然触发了您的< div>中的点击.这就是所谓的“

event bubbling”.

其实有多种解决方案：

>检查DIV点击事件处理程序是否实际的目标元素是锚点

→ jsFiddle

$('.expandable-panel-heading').click(function (evt) {

if (evt.target.tagName != "A") {

alert('123');

}

// Also possible if conditions:

// - evt.target.id != "ancherComplaint"

// - !$(evt.target).is("#ancherComplaint")

});

$("#ancherComplaint").click(function () {

alert($(this).attr("id"));

});

>从锚点击监听器停止事件传播

→ jsFiddle

$("#ancherComplaint").click(function (evt) {

evt.stopPropagation();

alert($(this).attr("id"));

});

您可能已经注意到,我从示例中删除了以下选择器部分：

:not(#ancherComplaint)

这是不必要的,因为没有类的.expandable-panel-heading也有#ancherComplaint作为其ID.

我假设你想抑制锚的事件.这不能以这种方式工作,因为两个选择器(您和我的)选择完全相同的DIV.选择器在调用时对听众没有影响;它只设置监听器应该注册到的元素的列表.由于这两个版本的列表是一样的,所以没有区别.