Meerdere event handlers op een element in JavaScript
Als een element meerdere event handlers
heeft voor dezelfde gebeurtenis, dan zullen
ze allemaal worden uitgevoerd, zelfs als
het bubbling wordt gestopt. Dat wil zeggen,
stopPropagation voorkomt dat de gebeurtenis
verder gaat, maar op het huidige element zullen
alle handlers worden uitgevoerd. Zie het voorbeeld:
elem1.addEventListener('click', function() {
console.log('groen');
});
elem2.addEventListener('click', function(event) {
console.log('lichtblauw - eerste handler');
event.stopPropagation(); // stop de bubbling
});
elem2.addEventListener('click', function() {
console.log('lichtblauw - tweede handler'); // wordt toch uitgevoerd
});
elem3.addEventListener('click', function() {
console.log('rood');
});
Je kunt het testen:
