Спыненне ўсплыцця падзей у JavaScript

Усплыццё падзеі можна спыніць на любым элеменце, праз які ўсплывае падзея. Для гэтага ў кодзе элемента варта выклікаць метад stopPropagation аб'екта Event.

У наступным прыкладзе клік па чырвоным блоке спрацуе на ім самім, затым на блакітным блаку і ўсё - блакітны блок спыняе далейшае ўсплыццё і зялёны блок ужо ніяк не адрэагуе:

javascriptelem1.addEventListener('click', function() {
  console.log('зялёны');
});
elem2.addEventListener('click', function(event) {
  console.log('блакітны');
  event.stopPropagation(); // спынім ўсплыццё
});
elem3.addEventListener('click', function() {
  console.log('чырвоны');
});

Можаце праверыць: