在 Javascript 中，如何从父事件处理程序中防止子元素的默认值答案

【问题标题】：In Javascript, how to preventDefault on a child element from within parent event handler在 Javascript 中，如何从父事件处理程序中防止子元素的默认值
【发布时间】：2012-05-11 20:53:04
【问题描述】：

假设我有这样的 HTML：

<div>
    <a href="http://google.com">Google</a>
</div>

我有一个像这样的事件处理程序（假设我有可用的 jQuery）：

$('div').on('click', function(ev) {
    // ...
});

是否可以在该事件处理程序中阻止<a> 链接的默认操作？还是为时已晚？（换句话说，我是否需要在<a> 或更低级别上附加一个事件以防止默认链接操作，或者是否可以在上述处理程序中停止它。

如上所述，如果解决方案需要，我可以使用 jQuery。

【问题讨论】：

你能检查一下 event.target.nodeName 的 A vs DIV 吗？

标签： javascript jquery jquery-events preventdefault

【解决方案1】：

这肯定会奏效：

$('div').on('click', "a", function(e) {
    e.preventDefault();
});

这是一个小提琴：http://jsfiddle.net/xvKNC/1/

等一下。这似乎在 Chrome 中对我来说很好用

// prevent default on every click in the div
$('div').on('click', function(ev) {
    ev.preventDefault();
});

查看更新的小提琴： http://jsfiddle.net/xvKNC/2/

【讨论】：

谢谢，但不幸的是，委托对我正在处理的情况没有帮助（或者更确切地说，我可以使用一些复杂的委托技巧来解决这个问题，但我希望没有到）。
啊，对不起。也许你可以以某种方式简化它？
我的小提琴可能有助于显示事情发生的顺序，因为它使用 hashchange 来检测通过的链接。

【解决方案2】：

它似乎有效：

$('div').on('click', function(ev) {
    ev.stopImmediatePropagation();
    ev.preventDefault();

});

JSFiddle：http://jsfiddle.net/3yFfC/

【讨论】：