같은 element에 등록된 여러 이벤트 리스너 호출을 막는 stopImmediatePropagation()

문제

여태 preventDefault()나 stopPropagation()을 사용할 일은 많았다. 그런데 오늘 모달 팝업 개발 중, 공통에서 처리해둔 닫기버튼 이벤트 전에 confirm을 띄워야 하는 일이 생겼다.

하나의 엘리먼트에 다른 클릭 이벤트 리스너를 추가해서 이벤트 전파를 막아야 하는 것이다. 결론저으로 앞에 언급한 두 가지 모두 아니고, stopImmediatePropagation()을 사용해야 한다.

정리

1. preventDefault - 기본 동작을 막는다. (예컨대 submit 버튼이라면 form submit을 막음)
2. stopPropagation - 이벤트 버블링을 방지한다.
3. stopImmediatePropagation - 같은 element 동일한 이벤트(예:클릭)에 여러 리스너가 등록되어 있다면 그 실행을 막는다. 실행 순서는 나중에 등록한 리스너부터 실행되는 것 같다.