JavaScript - Event 객체

자바스크립트 이벤트 ..................................................... 아주 중요한 이벤트!!! 이벤트란 모든 행위를 말하는 것으로 프로그램에서는 미리 사용자의 행위를 예측하여 미리 사용할 수 있도록 이벤트를 많이 준비해 놓고 있다. 예를 들어 사용자가 마우스를 클릭할 것이다.... 이건 click 이벤트로 준비! 이게 없다면 우리는 사용자가 마우스를 클릭했는지 부터 알아내야 다음 일을 할 수 있을 것이다. 고맙게도 click이 일어났다는 걸 자동으로 알 수 있으니 얼마나 고마운 일인가... (Click, MouseOver, MouseOut, Submit...) 이벤트 핸들러란 ? 이러한 이벤트와 우리가 준비한 프로그램을 연결해 주는 구실을 한다 (onClick,onMouseOver,onMouseOut, onSubmit...) * 그래서 우리가 할일은 이벤트가 일어났을 때 할 일을 준비하고 이벤트 핸들러에게 그 일을 하도록 연결해 두면 되는 것이다~~~

■ 이벤트의 종류와 의미 (이벤트핸들러는 이벤트에 on을 붙여 준다)

blur	포커스를 다른곳으로 옮길 경우
click	링크나 폼의 구성원을 클릭할 때
change	선택값을 바꿀 경우
focus	포커스가 위치할 경우
mouseover	마우스가 올라올 경우
mouseout	마우스가 떠날 경우
mousedown	마우스를 누를 경우
mousemove	마우스를 움직일 경우
mouseup	마우스를 눌렀다 놓을 경우
select	입력양식의 하나가 선택될 때
submit	폼을 전송하는 경우
load	페이지,윈도우가 브라우져로 읽혀질 때
unload	현재의 브라우저,윈도우를 떠날 때
error	문서나 이미지에서 에러를 만났을 때
reset	리셋 버튼이 눌렸을 때
dbclick	더블클릭시
dragdrop	마우스 누르고 움직일 경우
keydown	키 입력시
keypress	키 누를 때
keyup	키를 누르고 놓았을 때
move	윈도우나 프레임을 움직일 때
resize	윈도우나 프레임 사이즈를 움직일 때

■ 메서드

blur()	입력 포커스를 다른 곳으로 이동시킴
click()	마우스 버튼이 눌러진 것처럼 해줌
focus()	입력 포커스를 준 것처럼 해줌
submit()	폼의 submit 버튼을 누른 것처럼 해줌
select()	메소드 폼의 특정 입력 필드를 선택함

■ 속성

event.keyCode	누른 키의 ASCII 정수 값
event.x	문서 기준 누른 좌표의 left
event.y	문서 기준 누른 좌표의 top
event.clientX	문서 기준 누른 좌표의 left
event.clientY	문서 기준 누른 좌표의 top
event.screenX	콘테이너 기준 누른 좌표의 left
event.screenY	콘테이너 기준 누른 좌표의 top

■ 브라우저 객체별 이벤트 핸들러

선택 목록(SELECT)	onBlur, onChange, onFocus
문자 필드(TEXT)	onBlur, onChange, onFocus, onSelect
문자 영역(TEXTAREA)	onBlur, onChange, onFocus, onSelect
버튼(BUTTON)	onClick
체크박스(CHECKBOX)	onClick
라디오 버튼(RADID)	onClick
링크	onClick, onMouseover
RESET 버튼(RESET)	onClick
SUBMIT 버튼(BUTTON)	onClick
DOCUMENT	onLoad, onUnload
WINDOW	onLoad, onUnload
폼(FORM)	onSubmit