javascript - onclick 监听器监听子元素点击

Question

所以我有以下事件监听器:

$("#searchArea dl dd a").on('click',function(e){
    //code
});

我希望它仅在单击“dd”节点(位于#searchArea div 中)内的“a”节点时执行该功能，但我在“a”节点内也有一些“i”节点.显然，事件监听器在单击时也会执行该功能。

结构示例:

<div id="searchArea">
    <dl>
        <dd>
            <a>
                <i></i>
            <a>
        <dd>
    <dl>
</div>

有什么方法可以阻止“i”节点在被点击时执行函数吗？ 非常感谢您的帮助。

Answer 1

只比较事件的目标:

$("#searchArea dl dd a").on('click',function(e){
    if (e.target !== this) return;
    //code
});

(请注意，这利用了 jQuery 规范化事件对象这一事实，因此在所有浏览器中都会有一个“目标”属性。)