Zastavenie propagácie udalostí v JavaScripte
Propagáciu udalosti je možné zastaviť na akomkoľvek
elemente, cez ktorý udalosť prechádza.
Na to je potrebné v kóde elementu zavolať
metódu stopPropagation objektu Event.
V nasledujúcom príklade kliknutie na červený blok sa vykoná na ňom samotnom, potom na modrom bloku a to je všetko - modrý blok zastaví ďalšiu propagáciu a zelený blok už nijako nezareaguje:
elem1.addEventListener('click', function() {
console.log('zelený');
});
elem2.addEventListener('click', function(event) {
console.log('modrý');
event.stopPropagation(); // zastavíme propagáciu
});
elem3.addEventListener('click', function() {
console.log('červený');
});
Môžete vyskúšať:
