prevent

기본 이벤트 방지

태그 중에는 기본 이벤트가 정의되어 있는 태그들이 존재한다. 예를 들면 다음과 같은 것들이 있다.

  • <a>는 클릭 시 href 속성으로 자동 이동한다.

  • <form>은 submit 발생 시 action 속성으로 데이터를 전송한다.

이러한 기본 이벤트를 방지하기 위해서 JS와 jQuery는 다음과 같이 처리해야한다.

inline html

<a onclick="return false">click</a>

javascript

document.querySelector("a").addEventListener("click", function(e){
    e.preventDefault();
});

jQuery

$("a").click(function(e){
    //return false;
    //또는
    //e.preventDefault();
});

VueJS는 이러한 기본이벤트 방지를 .prevent 수식어로 처리한다.

사용 예제 - a 태그

사용 예제 - form 태그

Last updated