Zaustavljanje propagacije (bubbling) događaja u JavaScriptu

Propagaciju događaja (bubbling) možeš zaustaviti na bilo kom elementu kroz koji se događaj propagira. Za to u kodu elementa treba da pozoveš metod stopPropagation objekta Event.

U sledećem primeru, klik na crveni blok će se okidačiti na njemu samom, zatim na plavom bloku i to je sve - plavi blok zaustavlja dalju propagaciju i zeleni blok neće reagovati:

javascriptelem1.addEventListener('click', function() {
  console.log('zeleni');
});
elem2.addEventListener('click', function(event) {
  console.log('plavi');
  event.stopPropagation(); // zaustavljamo propagaciju
});
elem3.addEventListener('click', function() {
  console.log('crveni');
});

Možeš da proveriš: