如何在不触发 div click 事件的情况下处理绑定了 click 事件的 div 内的锚点答案

【问题标题】：How do you handle anchor inside a div with a click event bound to it without triggering the div click event如何在不触发 div click 事件的情况下处理绑定了 click 事件的 div 内的锚点
【发布时间】：2012-01-04 02:26:20
【问题描述】：

我有一个绑定了点击事件的 div。我想在这个 div 中添加一个不会触发 div 点击动作的锚标记。我尝试将'onclick="return false;"' 放在锚点上，但它仍然会触发对 div 的点击。这有什么诀窍吗？

【问题讨论】：

如何将点击处理程序绑定到 div 元素？
我正在使用 jquery .click 方法
How to stop event propagation with inline onclick attribute?的可能重复

标签： javascript jquery html

【解决方案1】：

鉴于您使用的是 jQuery 的 click()，您可以这样做：

$('div').click(
    function(e){
        if (e.target.tagName == 'A') {
            return false; // do nothing if the click is on the a element
        }
        else {
            // do something else
        }
    });

或者：

$('a').click(
    function(e){
        e.stopPropagation(); // stops the click moving up to the parent elements
    });

【讨论】：

【解决方案2】：

为了防止它，您应该防止事件冒泡。对于没有 w3c 浏览器，有 cancelBubble 属性，其他方式有 stopPropagation。

以您希望更好地使用它的方式以一种样式设置事件。对于这种情况，jquery 有： event.stopPropagation 和 event.stopImmediatePropagation 防止它在所有浏览器中以一种方式冒泡的方法。

【讨论】：