按特定键在JavaScript中执行某些操作在Chrome中有效，但在Firefox中无效

我使用两个函数来检测一个按下的键是否与我想要的匹配，如果匹配，就做些什么。它在Chrome中很有魅力，但在Firefox中这两个功能都不起作用。有没有办法让它也在那里工作

document.onkeypress=函数（）{
如果（event.charCode==49）{
警报（“您按了1！”）；
}
如果（event.charCode==50）{
警报（“您按了2！”）；
}
如果（event.charCode==51）{
警惕（“你按了3！”）；
}
如果（event.charCode==52）{
警惕（“你按了4！”）；
}
}
document.onkeydown=函数（）{
如果（event.keyCode==122）{
警报（“您按了F11！”）；
}
}

---

按1、2、3、4和F11启动不同的事件。

您忘记声明

事件

参数。也许Chrome会自动完成这项工作。 这在两种浏览器中都适用-

document.onkeypress = function(event) {
  if (event.charCode == 49) {
    alert("You pressed 1!");
  }
  if (event.charCode == 50) {
    alert("You pressed 2!");
  }
  if (event.charCode == 51) {
    alert("You pressed 3!");
  }
  if (event.charCode == 52) {
    alert("You pressed 4!");
  }
}

document.onkeydown = function(event) {
  if (event.keyCode == 122) {
    alert("You pressed F11!");
  }
}

---

该代码中的主要问题是您依赖于全局

事件
对象，该对象未在DOM事件规范中指定，并且是Chrome决定支持的Microsoft特定对象

在符合标准的浏览器上，使用
addEventListener
并接受事件对象作为参数：

document.addEventListener("keypress", function(e) {
    // ....
}, false);

如果您需要支持IE8及更早版本（或IE9+处于中断的“兼容性”模式），则需要
attachEvent
，它希望您使用全局
事件
对象：

document.attachEvent("onkeypress", function() {
    // ....
});

因此：

第二个问题是
charCode
已被弃用，您应该使用
which
表示数值，或（对于可打印字符）使用
char
表示（一个字符）字符串。对于较旧的浏览器，您可能会退回到
charCode
或
keyCode

我也会使用
开关

因此：


函数处理程序（e）{
e=e | | window.event；
开关（e.which | | e.charCode | | e.keyCode）{
案例49：
log（“您按了1”）；
打破
案例50：
log（“您按了2”）；
打破
案例51：
log（“您按了3”）；
打破
案例52：
log（“您按了4”）；
打破
}
}
if（文件增补列表器）{
文件。添加的文本列表器（“按键”，处理程序，错误）；
}否则{
文件。附件（“onkeypress”，处理程序）；
}

这比我想象的要容易得多，但我自己却无法解决。非常感谢。这比我预期的要详细得多，虽然另一个答案解决了我的问题，但我很感兴趣，因为这似乎更正确。我见过类似的代码块，人们总是使用“e”，有什么原因吗？我想象它的“e”和“event”一样。还有，什么是“（e.which | | e.charCode | | e.keyCode）”位？我想如果这三个选项中的任何一个都是真的，那么它会使代码运行，并且它会确保代码在不同的浏览器上运行。那么“e=e | | window.event”呢？我不知道这是怎么回事。@SoKeT:
e
只是
event
的缩写，你可以在那里使用任何你想要的名字（包括
event
）
e.which | | | e.charCode | | e.keyCode
使用JavaScript将值切换到第一个具有真实值的属性
undefined | | 49
是JavaScript中的
49
，因此如果浏览器不提供
e.which
但提供了其他浏览器之一，我们将使用它提供的浏览器。我们在
e=e | | window.event
@SoKeT中使用了相同的功能：请注意，如果您在IE8或更早版本上（或在“兼容模式”下的IE9+中）运行另一个答案中的代码，它将失败，因为不会向处理程序传递任何事件参数。感谢您的精彩解释和博客文章，现在一切都清楚了。我真的不需要确保我的代码在Chrome和Firefox以外的浏览器上运行，因为这只是我为了好玩和学习而做的一个项目，但我将尝试实现您的解决方案。
function handler(e) {
    e = e || window.event;
    // ...
}
if (document.addEventListener) {
    document.addEventListener("keypress", handler, false);
} else {
    document.attachEvent("onkeypress", handler);
}