개요

이것은 브라우저 xJavaScript를 사용하여 키보드 이벤트를 처리하고 키를 판단할 때 사용하는 속성의 요약입니다

대략 말하면, 이벤트.key 또는 이벤트코드 중 하나를 사용해야 합니다

'만약 ●눌렸다면'이라는 판정을 내리고 싶을 때 이벤트.key 또는 이벤트코드의 어떤 것으로 판단합니다.

키 판정에는 여러 가지 속성이 있는데 어떤 것을 사용하는 것이 좋습니까?이런 고민이 있다

이전에 자주 사용했던 이벤트.keyCode 등은 deprecated

키 획득 방법
컨디션
개요
참고 자료
event.key
추천(정확히 WD)
키 속성 값 ≈ 입력한 텍스트/예를 들어 전체 키보드의 5도 NumPad의 5도 이벤트입니다.키에서 얻은 것은'5'지리적 위치와 시스템급 관건도의 영향이다
W3C
event.code
추천(정확히 WD)
물리 키를 얻다.· 5를 누르면 전체 키보드의 5(Digit5)와 NumPad의 5(NumPad5)가 구별되고 상위의 키 매핑의 영향을 받지 않는다.· IE 가 개체에 없음
Key Codes for Standard Keyboards
W3C
event.keyCode
Deprecated(앞으로 사용하지 않음)
디지털이 관건적인 코드를 얻는 언어 환경과 시스템급 버튼맵의 영향을 받다
MDN
event.which
Deprecated(앞으로 사용하지 않음)
키 코드·이벤트를 수치로 얻습니다.키코드랑 똑같아요.
MDN
event.keyIdentifier
Deprecated(앞으로 사용하지 않음)
'키 identifier' 문자열 가져오기/비표준 → 같은 기능을 가진 이벤트.키 사용
MDN
event.charCode
Deprecated(앞으로 사용하지 않음)
키 코드 값 가져오기 (유니버설)/비표준
MDN
손질 키
키 상태 획득 방법
타입
개요
event.ctrlKey
boolean
ctrl 키를 눌렀는지 여부
event.shiftKey
boolean
시프트 키를 눌렀는지 여부
event.altKey
boolean
alt 키를 눌렀는지 여부
event.metaKey
boolean
meta 키를 눌렀는지 여부

샘플 코드

Ctrl+V 샘플 검사

document.body.addEventListener('keydown',
    event => {
        if (event.key === 'v' && event.ctrlKey) {
           alert("Ctrl+Vが押されました")
        }
    });

See the Pen qBdOLjw by Tom Misawa ( @riversun )
on CodePen .