我以为这将在Stack Overflow的某个地方得到回答,但我找不到它。

如果我正在监听按键事件,我应该使用.keyCode还是.which来确定是否按下了Enter键?

我总是这样做:

$("#someid").keypress(function(e) {
  if (e.keyCode === 13) {
    e.preventDefault();
    // do something
  }
});

但我看到一些例子使用。which而不是。keycode。有什么不同?是否其中一种比另一种更适合跨浏览器?


当前回答

一个健壮的Javascript库,用于捕获键盘输入和输入的组合键。它没有依赖关系。

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

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;
    }
});

热键支持以下修饰符:` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` `。

以下特殊键可用于快捷键:退格键、tab键、清除键、enter键、return键、esc键、escape键、空格键、上、下、左、右、home键、end键、pageup键、pagedown键、del键、delete键以及f1到f19键。

其他回答

Note: The answer below was written in 2010. Here many years later, both keyCode and which are deprecated in favor of key (for the logical key) and code (for the physical placement of the key). But note that IE doesn't support code, and its support for key is based on an older version of the spec so isn't quite correct. As I write this, the current Edge based on EdgeHTML and Chakra doesn't support code either, but Microsoft is rolling out its Blink- and V8- based replacement for Edge, which presumably does/will.


有些浏览器使用keyCode,有些使用which。

如果你使用的是jQuery,你可以可靠地使用它,因为jQuery是标准化的;更多的在这里。

如果你没有使用jQuery,你可以这样做:

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

或者:

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

…它处理e.which可能为0的可能性(通过使用JavaScript功能强大的||操作符,在末尾恢复0)。

我推荐活动。目前的关键。MDN文档:https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key

事件。键码和事件。它们在MDN页面的顶部都有讨厌的弃用警告: https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/which

对于字母数字键,事件。Key在所有浏览器中的实现似乎是相同的。对于控制键(tab, enter, escape等),事件。key在Chrome/FF/Safari/Opera中具有相同的值,但在IE10/11/Edge中具有不同的值(ie显然使用的是旧版本的规范,但截至2018年1月14日彼此匹配)。

对于字母数字键,检查应该是这样的:

event.key === 'a'

对于控制字符,你需要这样做:

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

我使用这里的示例在多个浏览器上测试(我必须以代码依赖方式打开并编辑以使其与IE10兼容):https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/code

事件。代码在另一个答案中提到了一种可能性,但IE10/11/Edge没有实现它,所以如果你想要IE支持,它就不存在了。

如果你使用的是普通Javascript,请注意keyCode现在已弃用并将被删除:

该特性已从Web标准中删除。尽管一些浏览器可能仍然支持它,但它正在被抛弃的过程中。尽量避免使用它,并更新现有的代码;请参阅本页底部的兼容性表,以指导您的决定。请注意,此功能可能在任何时候停止工作

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

相反,根据你想要的行为使用:.key或.code: https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/code https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key

两者都是在现代浏览器上实现的。

一个健壮的Javascript库,用于捕获键盘输入和输入的组合键。它没有依赖关系。

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

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;
    }
});

热键支持以下修饰符:` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` ` `。

以下特殊键可用于快捷键:退格键、tab键、清除键、enter键、return键、esc键、escape键、空格键、上、下、左、右、home键、end键、pageup键、pagedown键、del键、delete键以及f1到f19键。

jQuery规范化事件。这取决于是否事件。这事件。keyCode或事件。charCode是浏览器支持的:

// 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对鼠标点击也这样做:

// 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 ) ));
}