元素：keypress 事件

已弃用：此功能不再推荐。尽管一些浏览器可能仍然支持它，但它可能已从相关的 Web 标准中删除，或者可能正在被弃用，或者可能仅出于兼容性目的而保留。避免使用它，并尽可能更新现有代码；请参阅本页底部的兼容性表以指导您的决策。请注意，此功能可能随时停止工作。

当按下产生字符值的键时，会触发keypress事件。

产生字符值的键的示例包括字母键、数字键和标点符号键。不产生字符值的键的示例包括修饰键，例如Alt、Shift、Ctrl或Meta。

警告：由于此事件已弃用，因此您应该改用beforeinput或keydown。

语法

在诸如addEventListener()之类的方 法中使用事件名称，或设置事件处理程序属性。

js
addEventListener("keypress", (event) => {});

onkeypress = (event) => {};

事件类型

一个KeyboardEvent。继承自UIEvent和Event。

Event UIEvent KeyboardEvent

事件属性

此接口还继承了其父级UIEvent和Event的属性。

KeyboardEvent.altKey 只读

返回一个布尔值，如果在生成键事件时Alt（macOS 上的Option或⌥）键处于活动状态，则该值为true。

KeyboardEvent.code 只读

返回一个字符串，表示事件所代表的物理键的代码值。

KeyboardEvent.ctrlKey 只读

返回一个布尔值，如果在生成键盘事件时 Ctrl 键处于激活状态，则为 true。

KeyboardEvent.isComposing 只读

返回一个布尔值，如果事件在 compositionstart 之后和 compositionend 之前触发，则为 true。

KeyboardEvent.key 只读

返回一个字符串，表示事件所代表的键的键值。

KeyboardEvent.location 只读

返回一个数字，表示键盘或其他输入设备上键的位置。在 键盘位置 中显示了识别位置的常量列表。

KeyboardEvent.metaKey 只读

返回一个布尔值，如果在生成键盘事件时 Meta 键（在 Mac 键盘上为 ⌘ Command 键；在 Windows 键盘上为 Windows 键 (⊞)）处于激活状态，则为 true。

KeyboardEvent.repeat 只读

返回一个布尔值，如果键被按下并自动重复，则为 true。

KeyboardEvent.shiftKey 只读

返回一个布尔值，如果在生成键盘事件时 Shift 键处于激活状态，则为 true。

示例

addEventListener keypress 示例

此示例在您聚焦 <input> 元素后按下任何键时，都会记录 KeyboardEvent.code 值。

html
<div>
  <label for="sample">Focus the input and type something:</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 事件
# event-type-keypress
HTML 标准
# handler-onkeypress

浏览器兼容性

BCD 表格仅在浏览器中加载

另请参阅