jquery - 在这种情况下如何停止“传播”？

Question

<div id="container">
    <div id="link">Link</div>
</div>

$('#link').click(function (e) {
    console.log("link");                
});

$('#container').mousedown(function (e) {
    console.log("container");                
});

我希望这样，当我单击时#link，它不会触发#container处理程序。试过stopPropagation()or preventDefault()，但我认为这是错误的方法？

score 2 · Accepted Answer

处理程序在处理mousedown程序之前触发click，因此您不能mousedown从click处理程序中取消处理程序，因为mousedown事件已经冒泡到父元素。

在不修改其他处理程序的情况下，我只需mousedown向内部元素添加一个处理程序即可停止mousedown事件传播。

$('#link').click(function (e) {
    console.log("link");
}).mousedown(function (e) { //stops the mousedown event propagation from reaching
    e.stopPropagation();   //the parent element
});

$('#container').mousedown(function (e) {
    console.log("container");
});

小提琴

如果您能够切换处理程序来处理相同的事件（例如两者click），您将能够event.stopPropagation()从内部元素的处理程序调用，就像我对mousedown上面的处理程序所做的那样。