Eseménybuborékoltatás megállítása JavaScriptben

Az esemény buborékoltatása bármelyik elemen megállítható, amelyiken keresztül az esemény buborékol. Ehhez az elem kódjában meg kell hívni az Event objektum stopPropagation metódusát.

A következő példában a piros blokkra kattintva az esemény először magán a blokkon aktiválódik, majd a kék blokkon - itt a kék blokk megállítja a további buborékoltatást, így a zöld blokk már nem fog reagálni:

javascriptelem1.addEventListener('click', function() {
  console.log('zöld');
});
elem2.addEventListener('click', function(event) {
  console.log('kék');
  event.stopPropagation(); // megállítjuk a buborékoltatást
});
elem3.addEventListener('click', function() {
  console.log('piros');
});

Ellenőrizd le: