關於事件物件中的stopImmediatePropagation

龙陌發表於2024-05-11
事件物件

關於e.stopPropagation()，大家應該知道這個方法是用來阻止事件冒泡的。

那麼e.stopImmediatePropagation()可能比較少見。

stopImmediatePropagation

用來阻止在同一DOM物件上同一事件型別的其它事件函式的執行
並且與事件先後註冊的順序有關

document.addEventListener("click",e=>{
    console.log("click",1);
})

document.addEventListener("click",e=>{
    console.log("click",2);
})

正常就應該是這樣，如果你用document.onclick那麼我應該不用解釋吧。

加上e.stopImmediatePropagation();

document.addEventListener("click",e=>{
    e.stopImmediatePropagation();
    console.log("click",1);
})

document.addEventListener("click",e=>{
    console.log("click",2);
})

但阻止的是在其之後註冊事件

document.addEventListener("click",e=>{
    console.log("click",1);
})

document.addEventListener("click",e=>{
    e.stopImmediatePropagation();
    console.log("click",2);
})

這裡兩個事件都觸發了。

並且不同型別之間的事件不相影響

相關文章