Több eseménykezelő egy elemen JavaScriptben
Ha egy elemnek több eseménykezelője van
ugyanarra az eseményre, akkor még a bubbling
megállítása esetén is mindegyik végrehajtódik.
Vagyis a stopPropagation megakadályozza
az esemény továbbterjedését, de az aktuális
elemen minden eseménykezelő lefut. Lásd a példát:
elem1.addEventListener('click', function() {
console.log('zöld');
});
elem2.addEventListener('click', function(event) {
console.log('kék - első eseménykezelő');
event.stopPropagation(); // megállítjuk a bubblingot
});
elem2.addEventListener('click', function() {
console.log('kék - második eseménykezelő'); // így is lefut
});
elem3.addEventListener('click', function() {
console.log('piros');
});
Kipróbálhatod: