jQuery -为什么委托传播,即使在“e”之后.preventDefault '被调用

jQuery - why does delegate propagate, even after `e.preventDefault` is called?

本文关键字:preventDefault 之后 调用 为什么 传播 jQuery      更新时间:2023-09-26

我有一个嵌套链接的div。div对'click'有一个delegate处理程序,它会警告"div"。div中的链接也有一个delegate处理程序用于'click',其中e.preventDefault();在警告"link"之前被调用。当我点击链接时,我看到了"Div"警报和"Div"警报。我不清楚为什么会发生这种情况,因为我试图阻止链接的点击处理程序的传播。

JavaScript

$('body').delegate('.outer', 'click', function(e){
    e.preventDefault();
    alert('Div');
});
$('body').delegate('.outer a', 'click', function(e){
    e.preventDefault();
    alert('Link');
    // Note: I've also tried returning false (vs using preventDefault), per the docs
});

HTML

<div class="outer">
    <a href="#">Click me</a>
</div>
  1. PreventDefault不会阻止传播,它会阻止默认动作被采取。
  2. 返回false/stopPropagation对委托/活动事件不起作用,因为当它到达定义事件的元素时,它已经向上传播了。它将阻止传播到DOM中更高的元素,但不会阻止调用同一级别(或更低级别)的处理程序。请参阅http://api.jquery.com/delegate文档。

    因为.live()方法在事件传播到顶部的文档,是不可能停止传播的生活事件。类似地,.delegate()处理的事件也会传播他们被委派的元素;绑定的事件处理程序在DOM树中低于它的任何元素都已经被执行了到调用委托事件处理程序时。这些处理程序,因此,可能会阻止委托处理程序触发调用event.stopPropagation()或返回false。

  3. 如果你不希望在同一级别/DOM元素的其他处理程序运行,你可以使用stopImmediatePropagation。注意,应用处理程序的顺序很重要。

  4. 你可能应该使用on(),而不是像jQuery 1.7那样使用delegate/live。

您应该使用e.stopPropagation()来阻止您的事件冒泡