Element：keypress 事件
Deprecated
keypress 事件在按下字母、数字、标点或符号键时触发，或者在按下 Enter 键时触发——包括与 Shift 键或 Ctrl 键组合按下 Enter 的情况。否则，单独按下 Alt、Shift、Ctrl、Meta、Esc 或 Option 等修饰键时，不会触发 keypress 事件。
警告：由于此事件已被弃用，你应该改用 beforeinput 或 keydown。
语法
在 addEventListener() 等方法中使用事件名称，或设置事件处理器属性。
js
addEventListener("keypress", (event) => { })
onkeypress = (event) => { }
事件类型
KeyboardEvent。继承自 UIEvent 和 Event。
示例
addEventListener keypress 示例
每当你在聚焦 <input> 元素后按下某个键时，此示例会记录 KeyboardEvent.code 的值。
要查看哪些键会触发 keypress 事件、哪些键不会，可以试着按下以下按键：
- 字母键、数字键和标点键
- 符号键，例如 $、+、=、% 和 + 键
- 修饰键，例如 Alt、Shift、Ctrl、Meta、Esc、Option 或 ⌘ 键
- Enter 键
- 与 Shift 或 Ctrl 键组合的 Enter 键
- 与 Shift 或 Ctrl 以外的修饰键组合的 Enter 键
html
<div>
<label for="sample">聚焦输入框并输入一些内容：</label>
<input type="text" name="text" id="sample" />
</div>
<p id="log"></p>
js
const log = document.getElementById("log");
const input = document.querySelector("input");
input.addEventListener("keypress", logKey);
function logKey(e) {
log.textContent += ` ${e.code}`;
}
等效的 onkeypress
js
input.onkeypress = logKey;
规范
| 规范 |
|---|
| UI Events # event-type-keypress |
| HTML # handler-onkeypress |