자바스크립트의 키보드이벤트에는 keydown, keyup, keypress 이벤트가 있다.
· keydown이벤트
- 사용자가 키보드를 눌렀을 때 발생
- 사용자가 키보드를 누를 때마다 한 번씩 발생하며, 눌린 키와 상관없이 발생(shift, tab등 가능)
- 사용자가 키를 길게 누르고 있을 시 반복적으로 발생하지 않음
· keyup이벤트
- 사용자가 키보드를 눌렀다가 떼었을 때 발생
- keydown/keypress이후 keyup이벤트 발생
* keypress의 경우 shift, ctirl, alt 키 누르면 keypress이벤트 발생X, 그러나 뗄 경우 keyup이벤트 발생
· keypress이벤트
- 사용자가 키보드를 눌렀을 때 발생
- 키보드를 계속 누르고 있는 경우 계속 이벤트 발생
- 실제 키를 누를 때만 발생(keydwon과 다르게 shift,ctrl,alt등 키에 반응X)
아래 코드의 경우
text_box(좌측 텍스트상자) : keydown-keyup 이벤트
text_box_2(우측 텍스트상자) : keypress-keyup 이벤트 확인이 가능하다.
✅keydown과 keypress 두 이벤트 모두
사용자가 키보드를 눌렀을 때 발생하는 이벤트지만
keydown이벤트의 경우 눌린 키와 상관없이 발생되고 (shift.ctrl.tab등의 키에도 이벤트가 실행),
keypress는 실제 키에만 발생됨을 확인 할 수 있다.(shift.ctrl.tab등의 키 이벤트x)
'javascript&jquery > javascript' 카테고리의 다른 글
<javascript> 2. 배열(array) : concat(), slice(), splice(), push(), pop(), unshift(), shift(), indexOf() (0) | 2024.04.24 |
---|---|
<javascript> 1. 배열(array) : join(), reverse(),sort(),forEac (0) | 2024.04.23 |
<javascript> Math함수 : 숫자의 반올림(round), 올림(ceil), 내림(floor), 버림(trunc), 절대값(abs) (1) | 2024.04.15 |
<javascript> 객체요소의 우선순위 설정 (0) | 2024.04.09 |
<javascript> 반복되는 요소의 이벤트 적용 (0) | 2024.04.04 |