javascript - "KeyboardEvent.key"值跨浏览器一致吗?

标签 javascript reactjs keyboard cross-browser keyboard-events

我正在构建此组件,并且依靠 onKeyDown 处理程序中的 event.key 值来允许/禁止某些输入。

文档:

https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key/Key_Values

const ALLOWED_KEYS = [
  "Ctrl", "Meta", "Shift","Home", "End", 
  "Backspace", "Delete", 
  "ArrowLeft", "ArrowRight", "Tab"
];

// ....

function onKeyDown(event) {
  if (ALLOWED_KEYS.indexOf(event.key) >= 0) {
    console.log("Allowed...");
  }
  else {
    event.preventDefault();
    console.log("NOT allowed...");
  }
}

这些名称在浏览器中是否一致?我能否确定 ArrowRight 在 Chrome、Edge、Firefox、Safari 等上仍为 ArrowRight?或者我应该使用某种key代码值?

最佳答案

Here您拥有 w3.org 中的所有键码 ,这是跨浏览器的。这些是您要使用的键码。您可以输入 arrowLeft、right 或 Backspace 等来查找该键对应的键值

这个工具非常方便,因此您可以将此链接保存在某处。

关于javascript - "KeyboardEvent.key"值跨浏览器一致吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61235770/

相关文章:

ios - 键盘打开时推送到其他 View Controller

java - 使用Gson读取Json String结果报错 "not a JSON Array"

javascript - 在 React Native 中发布和订阅事件

javascript - 如何将物理添加到 CSS 动画中?

javascript - 组件之间状态变化的问题

c# - .NET 5 + 自定义 appsettings.json - SPA 默认页面中间件无法返回默认页面

iphone - 我可以摆脱 iPhone 键盘的最后一行或更改某些键的功能吗?

android - 如何在候选 View 上显示候选 View 和回收器选项卡 View 位置?

javascript - 单击时无法切换动画

javascript - 如何创建 "Magnet Links"