[CookBook] 이벤트 다루기
Chapter 7. 이벤트 다루기
DOM Level 1, DOM Level 2 이벤트 할당 방식.
참고 사이트:
DOM Level 1 Event Model
http://mohwaproject.tistory.com/entry/dom-event-1
Dom Level 2 Event Model
http://mohwaproject.tistory.com/entry/dom-event-4
1. 페이지를 완전히 읽어 들인 순간을 탐지하기
2. 이벤트 객체를 사용해서 마우스가 클릭된 위치 캡처하기
참고 사이트:
자바스크립트 Dimension (Screen, Viewport, Scroll, Element, Mouse Event)
3. 이벤트 삭제하기
4. 기본 이벤트 막기
보통 폼(Form or A(앵커)) 엘리먼트와 같이 기본 동작(Submit)이 할당된 엘리먼트는 해당 이벤트 시 다른 이벤트로 전파되기 전에 기본으로 할당된 이벤트를 취소해야 한다.
참고 사이트:
엘리먼트의 기본 동작 막기:
http: //mohwaproject.tistory.com/entry/dom-event-3
5. 중첩된 요소로 이벤트 전파 방지하기
참고 사이트:
Event Bubbling or Capture 이란?
6. 키보드 동작 핸들링 하기
ketCode or charCode 속성:
keyCode: IE or 오페라(사파리, 파폭, 크롬 또한 keyCode 속성을 지원하지만 keyCode 속성만 지원하는 브라우저(IE or 오페라)와 반환되는 keyCode가 일치하지 않는다.)
charCode: 사파리, 파폭, 크롬
키보드 이벤트 설명:
e.keydown: 키가 눌렸을때(모든 키에 반응한다.)
e.keyup: 키가 올라올때(모든 키에 반응한다.)
e.keypress: keydown 다음(단 문자(Enter 키 제외)를 입력했을때만 반응한다. 즉, Ctrl, Shift 키에서는 반응하지 않는다.)
7. HTML5 드래그 앤 드롭 사용하기
이 내용과 같은 경우 이전에 정리한 포스트 내용으로 대체 한다.
참고 사이트:
HTML5 File API 구현
http: //mohwaproject.tistory.com/entry/HTML5-File-API-%EA%B5%AC%ED%98%84