Zatrzymywanie propagacji zdarzeń w JavaScript
Propagację zdarzenia można zatrzymać na dowolnym
elemencie, przez który zdarzenie się propaguje.
Aby to zrobić, w kodzie elementu należy wywołać
metodę stopPropagation obiektu Event.
W następującym przykładzie kliknięcie czerwonego bloku zadziała na nim samym, następnie na niebieskim bloku i to wszystko - niebieski blok zatrzymuje dalszą propagację i zielony blok już w żaden sposób nie zareaguje:
elem1.addEventListener('click', function() {
console.log('zielony');
});
elem2.addEventListener('click', function(event) {
console.log('niebieski');
event.stopPropagation(); // zatrzymaj propagację
});
elem3.addEventListener('click', function() {
console.log('czerwony');
});
Możesz to sprawdzić: