keypress / keydown은 같은가?

• 키보드 이벤트
  • 자바스크립트를 이용하여 웹페이지 상에서 키보드 입력을 감지했을 때 발생하는 이벤트
  • keydown / keypress / keyup 이 있다.
• keypress / keydown은 키를 누른다는 것에 이벤트가 발생하는 건데 어떤 차이가 있을까

https://codepen.io/yamoo9/pen/vRmeQZ

DOM API - keydown, keypress, keyup, input 이벤트 간 차이

가장 직관적으로 알 수 있는 사이트

keydown

• 모든 키를 눌렀을 때 발생한다 (물리적으로 어떤 키가 눌렸는지)
• 방향키와 문자, 숫자, 특수 문자 키를 눌렀을 때 발생
• 단 문자, 숫자, 특수 문자, enter 키를 눌렀을 때는 연속적으로 발생하지만 그 외의 키를 눌렀을 때는 한번만 발생

 

 

keypress

• 문자 키를 눌렀을 때 연속적으로 발생한다 (실제로 어떤 값이 입력이 되는지)
• control, option, shift, tab, delete, 방향 키 등을 눌렀을 때는 발생하지 않고 문자, 숫자, 특수문자, enter키를 눌렀을 때만 발생한다. (제한적임)
• keypress는 누르고 있으면 지속적으로 실행된다.