Διακοπή της αναρρίχησης γεγονότων στο JavaScript

Η αναρρίχηση ενός γεγονότος μπορεί να σταματήσει σε οποιοδήποτε στοιχείο μέσω του οποίου αναρριχάται το γεγονός. Για αυτό, στον κώδικα του στοιχείου θα πρέπει να καλέσετε τη μέθοδο stopPropagation του αντικειμένου Event.

Στο επόμενο παράδειγμα, το κλικ στο κόκκινο μπλοκ θα ενεργοποιηθεί σε αυτό το ίδιο, μετά στο γαλάζιο μπλοκ και αυτό είναι όλο - το γαλάζιο μπλοκ διακόπτει την περαιτέρω αναρρίχηση και το πράσινο μπλοκ δεν θα αντιδράσει με κανέναν τρόπο:

elem1.addEventListener('click', function() {
	console.log('πράσινο');
});
elem2.addEventListener('click', function(event) {
	console.log('γαλάζιο');
	event.stopPropagation(); // σταματάμε την αναρρίχηση
});
elem3.addEventListener('click', function() {
	console.log('κόκκινο');
});

Μπορείτε να ελέγξετε: