Zastavení propagace událostí v JavaScriptu
Propagaci události lze zastavit na libovolném
prvku, kterým událost probublává.
K tomu je třeba v kódu prvku zavolat
metodu stopPropagation objektu Event.
V následujícím příkladu kliknutí na červený blok se aktivuje na něm samotném, poté na modrém bloku a to je vše - modrý blok zastaví další propagaci a zelený blok již nijak nezareaguje:
elem1.addEventListener('click', function() {
console.log('zelený');
});
elem2.addEventListener('click', function(event) {
console.log('modrý');
event.stopPropagation(); // zastavíme propagaci
});
elem3.addEventListener('click', function() {
console.log('červený');
});
Můžete vyzkoušet: