Nhiều trình xử lý sự kiện trên một phần tử trong JavaScript
Nếu một phần tử có nhiều trình xử lý cho cùng một sự kiện, thì ngay cả khi dừng sự nổi bọt, tất cả chúng vẫn sẽ được thực thi. Nghĩa là,
stopPropagation ngăn chặn sự kiện lan truyền xa hơn, nhưng tất cả các trình xử lý trên phần tử hiện tại sẽ vẫn chạy. Xem ví dụ:
elem1.addEventListener('click', function() {
console.log('xanh lá cây');
});
elem2.addEventListener('click', function(event) {
console.log('xanh da trời - trình xử lý đầu tiên');
event.stopPropagation(); // dừng sự nổi bọt
});
elem2.addEventListener('click', function() {
console.log('xanh da trời - trình xử lý thứ hai'); // vẫn sẽ chạy
});
elem3.addEventListener('click', function() {
console.log('đỏ');
});
Bạn có thể kiểm tra: