JS event (part. 05) - 디폴트 이벤트 제거

<form id="my-form">
  <label for="name">이름</label>
  <input type="text" name="name" id="name" /><br />
  <label for="pass">비밀번호</label>
  <input type="password" name="pass" id="pass" /><br />
  <label for="pass-check">비밀번호 확인</label>
  <input type="password" id="pass-check" /><br />
  <input type="submit" value="제출" />
</form>

html 작성

 

window.onload = function () {
  document.getElementById('my-form').onsubmit = function () {
    return false;
  };
};

submit 디폴트 이벤트 제거

 

window.onload = function () {
  document.getElementById('my-form').onsubmit = function () {
    var pass = document.getElementById('pass').value;
    var passCheck = document.getElementById('pass-check').value;

    if(pass == passCheck){
      alert("성공")
    }else{
      alert("비밀번호 확인 오류")
      return false;
    }
  };
};

 비밀번호 확인 (디폴트 이벤트 컨트롤)

 

고전 이벤트 모델은 return false를 입력,

인라인 이벤트 모델을 사용할 때는 form 태그 onsubmit 속성에 'return 함수()' 형태로 입력

function whenSubmit() {
	return false;
}

 

<form onsubmit="return whenSubmit()">
	<!-- 생략 -->
</form>