捕获按键而不在页面上放置输入元素？

Question

如何在不在 JavaScript 页面上放置输入元素的情况下捕获按键，例如 Ctrl+Z？似乎在 IE 中，keypress 和 keyup 事件只能绑定到输入元素（输入框、文本区域等）

原文由 powerboy 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

jQuery 也有一个非常容易使用的优秀实现。以下是跨浏览器实现此功能的方法：

 $(document).keypress(function(e){
    var checkWebkitandIE=(e.which==26 ? 1 : 0);
    var checkMoz=(e.which==122 && e.ctrlKey ? 1 : 0);

    if (checkWebkitandIE || checkMoz) $("body").append("<p>ctrl+z detected!</p>");
});

在 IE7、Firefox 3.6.3 和 Chrome 4.1.249.1064 中测试

另一种方法是使用 keydown 事件并跟踪 event.keyCode。但是，由于 jQuery 使用 event.which 规范化 keyCode 和 charCode，因此他们的规范建议在各种情况下使用 event.which：

 $(document).keydown(function(e){
if (e.keyCode==90 && e.ctrlKey)
    $("body").append("<p>ctrl+z detected!</p>");
});

原文由 Trafalmadorian 发布，翻译遵循 CC BY-SA 2.5 许可协议

Answer 2

对于不可打印的键，例如箭头键和快捷键，例如 Ctrl-z、Ctrl-x、Ctrl-c，它们可能会在浏览器中触发某些操作（例如，在可编辑的文档或元素中），您可能无法获得按键所有浏览器中的事件。因此，如果您有兴趣抑制浏览器的默认操作，则必须改用 keydown 。如果没有， keyup 也可以。

将 keydown 事件附加到 document 适用于所有主要浏览器：

 document.onkeydown = function(evt) {
    evt = evt || window.event;
    if (evt.ctrlKey && evt.keyCode == 90) {
        alert("Ctrl-Z");
    }
};

要获得完整的参考，我强烈推荐 Jan Wolter 关于 JavaScript 键处理的文章。

原文由 Tim Down 发布，翻译遵循 CC BY-SA 2.5 许可协议