Múltiplos manipuladores de eventos em um elemento em JavaScript
Se um elemento tem vários manipuladores
para o mesmo evento, mesmo que a propagação
seja interrompida, todos eles serão executados. Ou seja,
stopPropagation impede que o evento
prossiga para elementos superiores,
mas todos os manipuladores no elemento atual
serão executados. Veja o exemplo:
elem1.addEventListener('click', function() {
console.log('verde');
});
elem2.addEventListener('click', function(event) {
console.log('azul - primeiro manipulador');
event.stopPropagation(); // pararemos a propagação
});
elem2.addEventListener('click', function() {
console.log('azul - segundo manipulador'); // será executado mesmo assim
});
elem3.addEventListener('click', function() {
console.log('vermelho');
});
Você pode testar:
