이전에 공부하던 부분부터 이어서 플레이할 수 있습니다.
이어서 보기 처음부터 보기

EventHandler 설정

property에 직접 Handler설정

  • Element의 "on"+"이벤트" 의 속성에 메소드를 직접 지정
document.getElementById("form1").onsubmit = function eventHandler(){
    console.log("from property");
    return false; // 브라우저의 submit 처리 비활성
}

addEventListner 메소드

  • element의 addEventListener(이벤트, 함수) 메소드를 호출해, eventHandler 등록
    • 여러개의 이벤트 핸들러를 등록할 수 있음
document.getElementById("form1").addEventListener(
    "submit", 
    function eventHandler(){
        console.log("from addEventListener");
        return false;
    }
);

removeEventListener 메소드

  • element의 removeEventListener(이벤트, 함수) 메소드를 호출해, eventHandler 삭제

Event 종류

  • submit : form 태그의 submit 이벤트
    • EventHandler에서 return false 시 브라우저 자체 기능 (페이지 이동) 비활성
  • keydown : 키를 누른 경우 발생하는 이벤트
    • EventHandler에서 refturn false 시 키 입력 비활성
    • 실제로는 keydown event -> keypress event -> keyup event 순으로 이벤트가 발생하며 keypress event 발생시에 키가 입력됨. keydown event 에서 return false를 한 경우 keypress event가 이어서 발생하지 않음.

본 강의에 등록된 질문이 없습니다. 혹시 궁금하신 부분이 있으면 주저하지 말고 무엇이든 물어보세요.