본문 바로가기
728x90

javascript stopPropagation2

[Javascript] 이벤트 버블링 방지 stopImmediatePropagation [자바스크립트 / Javascript] 이벤트 버블링 방지 stopImmediatePropagation stopImmediatePropagation과 비슷한 역할을하는 stopPropagation이 있는데 이들은 비슷하면서도 다른 성격을 가지고 있다 stopPropagation 같은 경우에는 상위 관련 다른 모든 이벤트 버블링 차단 기능을 수행하고 stopImmediatePropagation 같은 경우에는 상위 및 현재 레벨에 걸려있는 관련 이벤트 모두 동작하지 않도록 중단하는 역할을 하는데 하단의 예제를 통해 자세히 알아보도록 하자 기본 형태 //이벤트 상위 전파 중단 event.stopPropagation(); //이벤트 상위, 현재 레벨에 걸린 다른 이벤트 또한 동작 중단 event.stopImme.. 2021. 5. 25.
[Javascript] 이벤트 전파 방지 stopPropagation() 자바스크립트 부모로의 이벤트 전파 방지 Event.stopPropagation(); 간단 설명 ↓ 자바스크립트에서 자식 엘리먼트에서 이벤트 발생시, 부모 엘리먼트에 같은 이벤트가 설정되어있다면, 해당 이벤트에 할당된 기능도 함께 실행된다. 이는 이벤트 전파 현상으로 인한 건데, 상단의 그림과 같이 이벤트가 전파되어진다. 위와 같은 현상을 방지하기 위해서는 Event.stopPropagation()을 사용해야하는데, 아래 예제를 참고하도록 한다. 샘플 예제↓ [Html] [Javascript] let secElem = document.querySelector('#section-sample'); let divElem = document.querySelector('#div-sample'); let btn = .. 2021. 2. 3.
728x90