자바스크립트 이벤트 핸들러 방법 – javascript eventhandler

  1. HTML 파일에 인라인으로 이벤트를 넣는 방법
    <form method="get" action="b.html" id="form1" onsubmit="console.log("자바스크립트로 이벤트 핸들러");
        return false;">
          이름 : <input type="text" name="id"><br>
          메세지 : <input type="text" name="msg"><br>
          <input type="submit">
        </form>

    이런식으로 HTML 코드 안에 넣는건데 좋은 방법은 아니라고 한다.

  2. javascript 속성
    var t = document.getElementById('form1');
        t.onsubmit = function a(){
          console.log("자바스크립트로 이벤트 핸들러");
          return false;
        }

    onsubmit 속성에 함수를 붙여준다. onclick 같은거도 마찬가지.

  3. addEventListener 메소드
    addEventListener("이벤트이름",실행할 함수);

    이 경우 실행할 함수는 먼저 정의되어 있어야 된다.

사실 그냥 이벤트만 추가할꺼라면 jQuery 로 사용하면 될 일이긴 하지만 좀더 심화된 프로그램을 짤때는 알아두는게 좋겠다.

의견을 남겨주세용