기본 이벤트(default event), 기본 이벤트 제거

CODEDRAGON Development/JavaScript, jQuery, ...

반응형

 

 

 

기본 이벤트(default event)

일부 HTML 태그는 이미 이벤트 핸들러를 가지고 있는데 이벤트가 발생할 때 이벤트 연결 없이 사용할 수 있는 이벤트가 있는데 이벤트를 기본 이벤트라고 합니다.

 

 

 

기본 이벤트 제거 

·       기본 이벤트가 있는 HTML 태그에 이벤트 연결을 하면 이벤트 연결에 의해 새롭게 호출되는 이벤트 핸들러와 기본 이벤트에 의해 고유의 이벤트 핸들러가 함께 호출되기 때문에 원하는 형태의 이벤트 처리가 어려워집니다. 따라서 기본 이벤트를 제거함으로써 원하는 이벤트 연결이 가능하게 처리해야 합니다.

·       HTML <a>요소에 클릭(click) 이벤트가 발생하면 브라우저는 지정된 주소로된 새로운 웹 페이지를 열게 됩니다. 이렇게 특정 이벤트는 미리 지정된 기본 동작을 가지고 있습니다.

·       하지만 preventDefalult() 메소드나 returnValue 프로퍼티를 이용하면, 이러한 기본 동작의 실행을 취소할 수 있습니다.

 

방법 설명
preventDefalult() 메소드 기본 이벤트 제거
returnValue 프로퍼티 기본 이벤트 제거

  

window.onload = function() {
// 이벤트를 연결
document.getElementById('my_form').onsubmit = function() {
//기본 이벤트 제거
return false;
};
};
 
<form id="my_form">
<label for="name">이름</label><br/>
<input type="text" name="name" id="name"/><br/>
<label for="pass">비밀번호</label><br/>
<input type="password" name="pass" id="pass"/><br/>
<label for="password_check">비밀번호 확인</label><br/>
<input type="password" id="password_check"/><br/>
<input type="submit" value="제출"/>
</form>