입력창 이벤트
| 이벤트 | 조건 |
|---|---|
| onblur | 입력창을 벗어났을때 |
| onchange(1) | 입력창의 내용을 바꿨을때 |
| onchange(2) | 드롭다운 메뉴에서 선택했을때 |
| onfocus | 입력창이 선택되었을때 |
| onselect | 입력창 안 글자가 선택 되었을때 |
| onreset | 리셋버튼이 눌러졌을때 |
| onkeydown | 유저가 키보드 키를 누르거나 누르고 있을때 |
| onkeypress | 유저가 키보드 키를 누르거나 누르고 있을때 |
| onkeyup | 유저가 키보드 키에서 손을 땔 때 |
onkeyup vs onkeydown
onkeydown같은 경우는 키보드 버튼을 누르거나 누르고 있을때 발생하는 이벤트이고,
onkeyup같은 경우에는 키보드 버튼에서 손을 땠을때 발생하는 이벤트이다.
onkeydown같은 경우는 누르고 있을때까지 신경을 써줘야해서 onkeyup을 주로 사용한다.
마우스 이벤트
| 이벤트 | 조건 |
|---|---|
| onmouseover onmouseout | 마우스 커서가 요소 위에 들어오거나 나갈때 |
| onmousedown onmouseup | 마우스 버튼을 누를때와 놔줄때 좌버튼 뿐만 아니라 우버튼과 휠버튼 등 모든 마우스 버튼에 작동하며 각 버튼은 구분된다. |
- 다른 이벤트들도 구분할 수 있는게 있지만 주로 사용하는 것들만 정리했다.
클릭 이벤트
| 이벤트 | 조건 |
|---|---|
| onclick | 버튼이 눌렸을때 |
| ondbclick | 요소를 더블클릭했을때 |
로드 이벤트
| 이벤트 | 조건 |
|---|---|
| onload | 페이지나 이미지가 로드 되었을때 |
| onerror | 이미지 로드 도중 오류가 발생했을때 |
| onunload | 브라우저가 문서를 닫았을때 |
| onresize | 브라우저 창크기를 바꾸었을때 |
어떻게 이걸 풀어낼 수 있을까