Event - JavaScript

이벤트(Event)

• 웹 페이지에서 상호작용이 있을 때 마다 이벤트가 발생한다.
  ex) 마우스 클릭, 키보드 누름 등
• JS를 사용하여 DOM에서 발생하는 이벤트를 감지 후 이벤트에 대응하는 여러 작업을 수행
• Event는 일반적으로 함수와 연결, 이벤트가 발생 시 함수 실행(평상시에는 실행 X)

MouseEvent

• onclick : 마우스로 Element를 클릭 했을 때 발생
• ondbclik : 마우스로 Element를 더블 클릭 했을 때 발생
• onmouseup : 마우스로 Element에서 마우스 버튼을 올렸을 때 발생
• onmousedown : 마우스로 Element에서 마우스 버튼을 눌렀을 때 발생
• onmouseover : 마우스를 움직여서 Element 밖에서 안으로 들어올 때 발생
• onmouseout : 마우스를 움직여서 Element 안에서 밖으로 나갈 때 발생
• onmousemove : 마우스를 움직일 때 발생

KeyboardEvent

• onkeypress : 키보드가 눌러졌을 때 발생(ASCII)
• onkeydown : 키보드를 누르는 순간 발생(KeyCode)
• onkeyup : 키보드를 누르고 있던 키를 뗄 때 발생

Frame(UI)Event

• onload : document, image, frame등이 모두 로딩 되었을 때 발생
• onabort : 이미지 등의 내용을 로딩하는 도중 취소 등으로 중단 되었을 때 발생
• onerror : 이미지 등의 내용을 로딩 중 오류가 발생 했을 때 발생
• onresize : document, element의 크기가 변경
• onscroll : document, element가 스크롤 되었을 때 발생
• onselect : 텍스트를 선택 했을 때 발생

FormEvent

• onsubmit : form이 전송될 때 발생
• onreset : 입력 form이 reset될 때 발생
• oninput : input 또는 textarea의 값이 변경 되었을 때 발생
• onchange : select box, checkbox, radio button의 상태가 변경 되었을 때 발생
• onfocus(focusin) : input과 같은 요소에 입력 포커스가 들어올 때 발생
• onblur(focusout) : input과 같은 요소 등에서 입력 포커스가 다른 곳에서 이동할 때 발생
• onselect : input, textarea에 입력 값 중 일부가 마우스 등으로 선택될때 발생