js 里面的键盘事件对应的键码

**键盘事件及其对应的键码**

在 JavaScript 中，键盘事件是指用户在键盘上输入字符或按下功能键时触发的事件。这些事件可以用来检测用户的输入行为，并根据需要进行相应的处理。

### 键盘事件类型JavaScript 提供了以下几种键盘事件：

* **keydown**: 当用户按下一个键时触发。
* **keyup**: 当用户松开一个键时触发。
* **keypress**: 当用户按下一个字符键（如 A、B 等）时触发。

### 键码每个键都有一个对应的键码，用于识别该键。这些键码是通过 ASCII 码来表示的。

#### 数字键和功能键数字键和功能键的键码如下：

| 键名 | 键码 |
| --- | --- |
|0 |48 |
|1 |49 |
|2 |50 |
|3 |51 |
|4 |52 |
|5 |53 |
|6 |54 |
|7 |55 |
|8 |56 |
|9 |57 |

| 键名 | 键码 |
| --- | --- |
| Esc |27 |
| F1 |112 |
| F2 |113 |
| F3 |114 |
| F4 |115 |
| F5 |116 |
| F6 |117 |
| F7 |118 |
| F8 |119 |
| F9 |120 |
| F10 |121 |
| F11 |122 |
| F12 |123 |

#### 方向键方向键的键码如下：

| 键名 | 键码 |
| --- | --- |
| ← |37 |
| ↑ |38 |
| → |39 |
| ↓ |40 |

#### 回车键和空格键回车键和空格键的键码如下：

| 键名 | 键码 |
| --- | --- |
| Enter |13 |
| Space |32 |

#### 删除键、撤销键和全选键删除键、撤销键和全选键的键码如下：

| 键名 | 键码 |
| --- | --- |
| Del |8 |
| Backspace |8 |
| Ctrl+Z |26 |

#### 其他键其他键的键码如下：

| 键名 | 键码 |
| --- | --- |
| Tab |9 |
| Shift |16 |
| Alt |18 |
| Ctrl |17 |
| Meta |91 |

### 示例代码以下是使用键盘事件的示例代码：

javascript// 获取元素const input = document.getElementById('input');

// 添加事件监听器input.addEventListener('keydown', (e) => {
 // console.log(e.key); // 输出按下的键 // console.log(e.keyCode); // 输出按下的键码});

input.addEventListener('keyup', (e) => {
 // console.log(e.key);
 // console.log(e.keyCode);
});

input.addEventListener('keypress', (e) => {
 // console.log(e.key);
 // console.log(e.keyCode);
});

javascript// 获取元素const input = document.getElementById('input');

// 添加事件监听器input.addEventListener('keydown', (e) => {
 if (e.keyCode ===13) { // 回车键 alert('回车键被按下');
 } else if (e.keyCode ===32) { // 空格键 alert('空格键被按下');
 }
});

javascript// 获取元素const input = document.getElementById('input');

// 添加事件监听器input.addEventListener('keydown', (e) => {
 switch (e.keyCode) {
 case37: // ← alert('← 键被按下');
 break;
 case38: // ↑ alert('↑ 键被按下');
 break;
 case39: // → alert('→ 键被按下');
 break;
 case40: // ↓ alert('↓ 键被按下');
 break;
 }
});