기본 이벤트가 실행되지 않도록 막아보자 | Event.preventDefault()

 

🚫 Event.preventDefault()

 

preventDefault()는 이벤트를 명시하지 않은 경우, 해당 이벤트에 대한 기본 동작을 실행하지 않도록 해주는 메서드이다.

 

예제를 살펴보자.

 

예제

 

event.prevenDefault()를 사용함으로써,

체크박스의 기본 기능인 체크와 제출하면서 페이지가 새로고침되는 것을 막을 수 있었다.

 

플젝을 하면서  form의 submit 이벤트 때문에 페이지가 refresh되는 것을 막기위해 많이 사용했던 것 같다.

ajax를 이용하여 비동기적으로 데이터를 받아올 때 사용하면 좋다.

 

 

Event.preventDefault() - Web API | MDN