javascript 이벤트

JavaScript Web Application - Chapter2 이벤트와 이벤트 관찰에서

이벤트는 자바스크립트 응용프로그램의 핵심이다. 이벤트는 애플리케이션을 동작시키는 원천이며 사용자가 애플리케이션과 의사 소통할 때 필요한 기능을 제공한다. 그러나 동시에 자바스크립느의 비 표준 문제를 일으키는 장본인이기도 하다.

브라우저 전쟁이 한창일 때 넷스케이프와 아이크로소프트는 서로 호환하지 않은 이벤트 모델이라는 것을 알면서도 각자 자신의 이벤트 모델을 선택했다. 결국 W3C에서 이벤트 모델을 표준화했지만 인터넷 익스플로러는 IE9까지도 자신만의 구혀을 고집했다.

다행이도 jQuery, Prototype 같은 훌류한 라이브러리 덕분에 모든 이벤트 구현에서 동작하는 프로그램을 만들 수 있다. 

이벤트 수신

addEventLintener( type, listener, useCapture );

type: 최근 브라우저의 일반적인 이벤트 지원목록

• click
• dbclick
• mousemove
• mouseover
• mouseout
• focus
• blur
• change ( 폼 입력용 )
• submit  ( 폼 전용 )

userCapture : 이벤트 순서

• 이벤트 캡처링 : 부모 --> 자식
• 이벤트 버블링 : 자식 --> 부모

이벤트 취소

• stopPropagation()
• jQuery: stopImmediatePropagation()
• 이벤트 기본동작 취소: preventDefault(), false 반환

이벤트 오브젝트

• Bubbles : DOM에서 이벤트 버블링 방식을 사용할지 지정하는 boolean 값

이벤트가 실행 되었을 때 환경을 반영하는 프로퍼티

• Button : 어떤 마우스 버튼이 눌렸느닞 가르키는 값
• ctrlKey : ctrl 키가 눌렸는지 가르키는 boolean 값
• altKey : alt 키가 눌렸는지 가르키는 boolean 값
• shiftKey : shift 키가 눌렸는지를 가르키는 boolean 값
• metaKey : 메타키 ( 키보드에서 Ctrl이나 Alt키와 함깨 눌렸을 때 다른 기능을 하는 키 )가 눌렸는지 가르키는 boolean 값

키보드 이벤트 과련 프로퍼티

• isChar: 이벤트가 키 문자를 포하는지 여부를 가르키는 boolean 값
• charCode : 눌려진 키으 유니코드 값 ( keypress 이벤트 전용 )
• keyCode : 비문자 키의 유니코드 값
• which : 문자여부와 관계없이 눌린 키의 유니코드 값

이벤트 발생 위치 프로퍼티

• pageX, pageY : 페이지 상이 이벤트 자표
• screenX, screenY : 화면상의 이벤트

이벤트 엘리먼트 프로퍼티

• currentTarget : 이벤트 버블링 과정에서 현재 처리 중인 DOM 엘리먼트
• target, originalTarget : 원래의 DOM 엘리머트
• relatedTarget: 이벤트와 관련된 다른 DOM 엘리먼트

DOM 이외의 이벤트

• 발행자/구독자 이벤트
• 벤 알만 제공 라이브러리 : jQuery 이용 애플리케이션에서 더 쉬운 작업 가능