[JS] click 이벤트시 blur이벤트 무시하기

어떠한 요소 A 가 blur 이벤트를 기다리는중이다. (요소가 focus 되어있는 상황)
이때 다른 요소 B 의 click 이벤트를 먼저 실행시키고 싶다면 어떻게 해야 할까?

B의 click 이벤트를 실행 시키면 mousedown -> blur -> click
순으로 이벤트가 실행이 된다.
브라우저의 click 이벤트에 대한 기본 동작이다.
위 순서를 봤을때 B의 click 이벤트가 실행이 된다면 blur 이벤트가 click 이벤트 보다 먼저 실행이 될 것이다.

그럼 click 이벤트시 blur 이벤트를 무시하는 방법은 없을까?

preventDefault()메서드를 사용하면 된다.
preventDefault는 브라우저의 기본 동작을 실행하지 않도록 해준다.

blur이벤트를 무시하는 법

1. click 이벤트를 달아준 B 에 mousedown 이벤트를 추가 해준다.
2. preventDefault 메서드를 실행시켜 해당 이벤트에 대한 사용자 에이전트의 기본 동작을 실행하지 않도록 지정한다.

참고자료
🔗 https://developer.mozilla.org/ko/docs/Web/API/Event/preventDefault