KeyboardEvent keyCode 属性

DOM 이벤트 KeyboardEvent

定义和用法

keyCode 属性返回触发 onkeypress 이벤트 的按键的 Unicode 字符代码，或触发 onkeydown 또는 onkeyup 이벤트 的按键的 Unicode 按键代码。

两种代码类型的区别：

  • 字符代码 - 代表 ASCII 字符的数字
  • 키 코드 - 키보드 상의 실제 키를 나타내는 숫자

이 유형들은 항상 동일한 의미를 가지지 않습니다. 예를 들어, 소문자 "w"와 대문자 "W"의 키보드 코드는 같지만("W" = 숫자 "87"), 결과 문자 코드는 다릅니다("w" 또는 "W", 즉 "119" 또는 "87"), 이는 키보드에서 누른 키가 같기 때문입니다 - 아래의 더 많은 예제를 통해 이 점을 더 잘 이해할 수 있습니다

ヒント：사용자가 출력 가능한 키(예: "a" 또는 "5")를 누른지 확인하려면 onkeypress 이벤트에서 이 속성을 사용하는 것이 좋습니다. 사용자가 기능 키(예: "F1", "CAPS LOCK" 또는 "Home")를 눌렀는지 확인하려면 onkeydown 또는 onkeyup 이벤트를 사용하세요

비고：Firefox에서 keyCode 속성은 onkeypress 이벤트에 대해 작동하지 않습니다(0만 반환됩니다). 크로스 브라우저 솔루션을 위해 다음을 사용하세요 which 속성예를 들어 keyCode와 함께 사용하면：

var x = event.which || event.keyCode;  // which를 사용할지 keyCode를 사용할지는 브라우저 지원에 따라 달라집니다

ヒント：모든 Unicode 문자의 목록은 다음을 참조하세요 전체 Unicode 참조。

ヒント：Unicode 값을 문자로 변환하려면 다음을 사용하세요 fromCharCode() 메서드。

비고：이 속성은 읽기 전용입니다。

비고：keyCode와 which 속성은 호환성을 위해 제공되었습니다. 최신 DOM 이벤트 표준에서는 가능하다면 key 속성을 사용하는 것이 좋습니다.

ヒント：키 입력 이벤트가 발생할 때 "ALT", "CTRL", "META", 또는 "SHIFT" 키가 눌렸는지 알고 싶다면, 다음을 사용하세요 altKey、ctrlKey/,metaKey 또는 shiftKey 속성。

예제

예제 1

누른 키보드 키의 Unicode 값을 가져옵니다：

var x = event.keyCode;

직접 테스트해 보세요

예제 2

사용 onkeypress와 onkeydown을 통해 문자 코드와 키보드 코드 간의 차이를 보여줍니다：

<input type="text" onkeypress="uniCharCode(event)" onkeydown="uniKeyCode(event)"> 
function uniCharCode(event) {
  var char = event.which || event.keyCode;
  document.getElementById("demo").innerHTML = "Unicode CHARACTER code: " + char;
}
function uniKeyCode(event) {
  var key = event.keyCode;
  document.getElementById("demo2").innerHTML = "Unicode KEY code: " + key;
}

키보드의 "a" 키를 누를 때(Capslock을 사용하지 않음), char와 key의 결과는 다음과 같습니다:

Unicode CHARACTER 코드: 97
Unicode KEY 코드: 65

직접 테스트해 보세요

예제 3

Escape 키를 누르면 어떤 텍스트를 표시하겠습니까:

<input type="text" onkeydown="myFunction(event)"> 
function myFunction(event) {
  var x = event.keyCode;
  if (x == 27) {  // 27은 ESC 키
    alert("You pressed the Escape key!");
  }
}

직접 테스트해 보세요

예제 4

Unicode 값을 문자로 변환하십시오(기능 키에 사용되지 않음):

var x = event.keyCode;                // Unicode 값을 가져옵니다
var y = String.fromCharCode(x);       // 값을 문자로 변환

직접 테스트해 보세요

문법

event.keyCode

기술 세부 사항

반환 값: Unicode 문자 코드 또는 Unicode 키 코드를 나타내는 숫자 값.
DOM 버전: DOM Level 2 이벤트

브라우저 지원

속성 Chrome IE Firefox Safari Opera
keyCode 지원 지원 지원 지원 지원

관련 페이지

HTML DOM 참조 가이드:KeyboardEvent key 속성

HTML DOM 참조 가이드:KeyboardEvent charCode 속성

HTML DOM 참조 가이드:KeyboardEvent which 속성

DOM 이벤트 KeyboardEvent