javascript - 如何始终在父元素上捕获 jQuery 事件

Question

HTML:

<div class="parent">
     <div class="child"></div>
</div>

jQuery:

$(".parent").on('click', callback);

问题是，根据样式(特别是鼠标指针单击的位置)，单击事件会在 .child 或 .parent 上触发，具体取决于鼠标。

是否有办法始终从 .parent 获取事件，即使在 .child 上单击该事件？我过去解决这个问题的方法是检查 $(event.target) 的 id 或类，如果它不是 .parent 那么我会做 $(event.target).parent() 但我需要一个适用于多种场景的解决方案，而不是修复。

Answer 1

使用event.currentTarget而不是event.target。 event.currentTarget 属性是事件冒泡阶段中的当前 DOM 元素，通常等于 this。

event.currentTarget - 事件冒泡阶段中的当前 DOM 元素。

event.target - 发起事件的 DOM 元素。

$(".parent").on('click', callback);

function callback(event){

    alert( event.currentTarget === this );
}

fiddle for event.currentTarget - FIDDLE

fiddle for event.target - FIDDLE2