如何防止默认事件触发但仍允许事件冒泡

Posted 2023-05-07

【中文标题】如何防止默认事件触发但仍允许事件冒泡

【英文标题】：How to prevent default event firing but still allow event to bubble

【发布时间】：2011-10-08 09:44:20

【问题描述】：

使用 jQuery：使用以下代码，我想防止在单击时触发 href url（在本例中为哈希“#”），但仍允许单击事件继续在链上冒泡。请问如何实现？

<div>
    <a href="#">Test</a>
</div>

$('a').click(function(e)
    // stop a.click firing but allow click event to continue bubbling?
);

【参考方案1】：

$('a').click(function(e)
    e.preventDefault();
    // stop a.click firing but allow click event to continue bubbling?
);

e.preventDefault() 不会阻止冒泡，e.stopPropagation() 或 return false（同时停止）会。

【讨论】：

重点是需要冒泡，只是不要运行默认进程。

这正是e.preventDefault(); 会做的事情。我删除了额外的位，以便 OP 知道下次出现此类问题时。

@Shef 感谢 Shef 和其他所有人。我已经将 e.preventDefault() 与 'return false' 结合使用已有一段时间了，但以前从未使用过事件委托的好处，这就是出现此查询的原因。

【参考方案2】：

你可以这样做：

$('a').click(function(e)
     e.preventDefault();
    // stop a.click firing but allow click event to continue bubbling?

);

在这里摆弄http://jsfiddle.net/tU53v/

【参考方案3】：

试试这个..

$('a').click(function(e)
     e.preventDefault();
    // stop a.click firing but allow click event to continue bubbling?

);

here你可以找到return false和e.preventDefault();之间的区别