关于javascript：.keyCode与。哪个


.keyCode vs. .which

我以为可以在Stack Overflow的某处得到答案，但是我找不到。

如果我正在听按键事件，是否应该使用.keyCode或.which来确定是否按下Enter键？

我一直都做以下事情：

1
2
3
4
5
6
$("#someid").keypress(function(e) {
  if (e.keyCode === 13) {
    e.preventDefault();
    // do something
  }
});

但是我看到的示例使用.which而不是.keyCode。 有什么不同？ 一个跨浏览器比另一个浏览器更友好吗？

相关讨论

注意：以下答案写于2010年。多年后，keyCode和which都被弃用，而赞成key(用于逻辑键)和code(用于键的物理位置) 。但是请注意，IE不支持code，并且它对key的支持基于规范的较旧版本，因此不太正确。在我撰写本文时，当前基于EdgeHTML和Chakra的Edge也不支持code，但是Microsoft正在为其Edge推出基于Blink和V8的替代产品，据推测可以/将要使用。

某些浏览器使用keyCode，其他浏览器使用which。

如果您使用的是jQuery，则可以可靠地使用which，因为jQuery可以使事情标准化。这里更多。

如果您不使用jQuery，则可以执行以下操作：

1
var key = 'which' in e ? e.which : e.keyCode;

或者：

1
var key = e.which || e.keyCode || 0;

...解决了e.which可能是0的可能性(通过使用JavaScript强大的||运算符在最后恢复0)。

相关讨论

jQuery根据浏览器是否支持event.which，event.keyCode或event.charCode对event.which进行标准化：

1
2
3
4
// Add which for key events
if ( event.which == null && (event.charCode != null || event.keyCode != null) ) {
   event.which = event.charCode != null ? event.charCode : event.keyCode;
}

.which的另一个好处是jQuery也可以通过鼠标单击来做到这一点：

1
2
3
4
5
// Add which for click: 1 === left; 2 === middle; 3 === right
// Note: button is not normalized, so don't use it
if ( !event.which && event.button !== undefined ) {
    event.which = (event.button & 1 ? 1 : ( event.button & 2 ? 3 : ( event.button & 4 ? 2 : 0 ) ));
}
相关讨论

如果您使用的是原始Javascript，请注意keyCode现在已弃用，将被删除：

This feature has been removed from the Web standards. Though some browsers may still support it, it is in the process of being dropped. Avoid using it and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any tim

https://developer.mozilla.org/zh-CN/docs/Web/API/KeyboardEvent/keyCode

而是根据您想要的行为使用：.key或.code：
https://developer.mozilla.org/zh-CN/docs/Web/API/KeyboardEvent/code
https://developer.mozilla.org/zh-CN/docs/Web/API/KeyboardEvent/key

两者均在现代浏览器上实现。

相关讨论

看一下这个：https://developer.mozilla.org/en-US/docs/Web/API/event.keyCode

在keypress事件中，所按下键的Unicode值存储在keyCode或charCode属性中，而不是两者都存储。如果按下的键生成一个字符(例如" a")，则考虑到字母大小写，将charCode设置为该字符的代码。 (即charCode考虑是否按住Shift键)。否则，按下的键的代码将存储在keyCode中。
keyCode始终在keydown和keyup事件中设置。在这些情况下，永远不会设置charCode。
要获取密钥的代码而不管它是存储在keyCode还是charCode中，请查询which属性。
通过IME输入的字符不会通过keyCode或charCode注册。

我目前建议event.key。 MDN文档：https：//developer.mozilla.org/zh-CN/docs/Web/API/KeyboardEvent/key

event.KeyCode和event.which的MDN页面顶部都已弃用了讨厌的警告：
https://developer.mozilla.org/zh-CN/docs/Web/API/KeyboardEvent/keyCode
https://developer.mozilla.org/zh-CN/docs/Web/API/KeyboardEvent/which

对于字母数字键，event.key似乎在所有浏览器中都实现相同。对于控制键(Tab，Enter，Escape等)，event.key在Chrome / FF / Safari / Opera中具有相同的值，但在IE10 / 11 / Edge中具有不同的值(IE显然使用了较早版本的规范，但匹配彼此截至2018年1月14日)。

对于字母数字键，检查将类似于：

1
event.key === 'a'

对于控制字符，您需要执行以下操作：

1
event.key === 'Esc' || event.key === 'Escape'

我在这里使用示例在多个浏览器上进行测试(我必须在Codepen中打开并进行编辑才能使其与IE10一起使用)：https://developer.mozilla.org/zh-CN/docs/Web/API/KeyboardEvent/码

event.code在另一种答案中有可能被提及，但是IE10 / 11 / Edge并未实现它，因此如果您要IE支持，就可以了。

一个强大的Javascript库，用于捕获键盘输入和输入的按键组合。它没有依赖性。

http://jaywcjlove.github.io/hotkeys/

1
2
3
4
5
6
7
8
hotkeys('ctrl+a,ctrl+b,r,f', function(event,handler){
    switch(handler.key){
        case"ctrl+a":alert('you pressed ctrl+a!');break;
        case"ctrl+b":alert('you pressed ctrl+b!');break;
        case"r":alert('you pressed r!');break;
        case"f":alert('you pressed f!');break;
    }
});

热键可理解以下修饰符：?，shift，option，?，alt，ctrl，control，command和?。

以下特殊键可用于快捷方式：backspace，tab，clear，enter，return，esc，escape，space，up，down， left，right，home，end，pageup，pagedown，del，delete和f1至f19。

相关讨论

在Firefox中，keyCode属性在onkeypress事件上不起作用(只会返回0)。对于跨浏览器解决方案，请结合使用which属性和keyCode，例如：

1
var x = event.which || event.keyCode;  // Use either which or keyCode, depending on browser support