Javascript 捕获web应用程序所有关键事件的最佳方法？

我对web应用程序密钥捕获的当前状态有点心烦意乱。只要您知道您的用户将在特定位置（例如，

输入

字段）键入内容，它就非常有效，但一旦您想要为整个“应用程序”执行全局快捷方式，它似乎就会崩溃

我试图找出是否有比我目前使用的方法更好的方法来捕获网页的所有关键事件

我当前的方法是使用绑定到

文档

元素的插件，即：

$(document).bind("keyup", "delete", function() {});

这在大多数情况下都非常有效，但例如在Firefox上，如果用户碰巧心不在焉地将鼠标移到导航栏上，delete键有时会导致用户“返回”，并且处理程序从未收到该键，因此我可以停止传播

是否有其他元素需要绑定？有更好的插件吗？我是否应该避免使用任何绑定到普通web浏览器的键

随着越来越多的web应用程序希望模仿桌面应用程序，这似乎是web开发人员越来越需要的一项基本功能

---

编辑：我应该指出，我已经在使用

e.stopPropagation（）

和

e.preventDefault（）

。主要的问题似乎是，有时事件甚至从未传递给绑定函数。我想知道除了

文档

之外，是否有人找到了一个“更高”的元素来绑定。还是有我从未想过的替代方案？例如，在页面上嵌入一个不可见的Flash元素，然后将该元素中的所有键传递给Javascript（我认为这行不通）

---

我想，在这一点上，我是在用“标准的、众所周知的方式”做事。我想看看是否有一种开箱即用的方式，这种方式并不广为人知，也许有人知道：-）。

绝对没有经过测试，但。。。在“窗口”元素上试用。

如果您正在制作一个带有自定义键盘控件的复杂web应用程序，您应该做的第一件事是提醒用户您正在制作一个带有自定义键盘控件的复杂web应用程序。在那之后，告诉他们这些控件是什么以及它们是做什么的

将

按键

和

向下键

侦听器绑定到

文档

是正确的方法，但对于要覆盖的按键，必须记住

防止默认

和/或

停止编程

。即使没有默认行为，您也需要防止它们层叠，以防用户反弹其默认键盘快捷键

此外，只有当页面具有焦点时，您才能接收键盘输入

当你说Delete时，我假设你是指Backspace键，因为Delete通常是指Insert、Home、End、Page Up和Page Down旁边的键

编辑以添加：

---

选择覆盖哪些关键点时要非常小心。如果你正在制作一个应用程序供你以外的人使用，你必须担心可用性和可访问性。覆盖制表符、空格键和回车键是有风险的，特别是对于使用屏幕阅读器的人来说。请确保对站点进行盲测试，并修复通过键盘浏览页面时可能出现的任何问题。

您无法绑定到无法控制的事件，例如Windows chrome。大多数Web应用程序处理此问题的方式是使用

onbeforeuload

事件，要求用户确认他们离开页面的决定：

window.onbeforeunload = function (e) {
    var str = 'Are you sure you want to leave this page?';
    e = e || window.event;

    if (userHasSomeUnsavedWork) {
        e.returnValue = str;
        return str;
    }
}

---

也许您可以使用html属性

ACCESSKEY

并对焦点做出反应。 i、 e:

我想你可能需要给标签添加一个tabindex，比如

是否可以强制聚焦在不可见的文本框上？我建议使用浏览器间共享的密钥。当你点击backspace时，期望一个页面不会返回是愚蠢的。你想创建快捷方式还是做一些键盘记录？@helle我想创建快捷方式，而不是键盘记录。是的，我是说backspace，虽然我会将这个特定的快捷键绑定到两个键。我已经在使用

e.stopPropogation

和

e.preventDefault

。主要的问题似乎是，有时我的事件听众甚至从未“听到”过事件。我同意选择要覆盖的键。我不想覆盖Enter或Tab等。主要是“在调整大小时按住Shift键以限制比例”、“按Delete/Backspace键删除此对象”、“按Ctrl+A键选择全部”——这与桌面应用程序中使用的快捷方式相同。@Riley Dutton，该文档是“最高的”您可以在网页上绑定关键事件的级别。正如我在帖子中所说，只有当页面有焦点时，你才能接收键盘输入。flash也是一样。你可能想在页面的某个地方放一个突出显示或通知，这样用户就可以清楚地知道页面何时有焦点和输入。这肯定是策略的一部分。我只是希望避免出现这样的情况，即用户获得该对话框并认为，“等等，我想删除此对象，为什么它告诉我要离开该页面？”谢谢，我将试一试。Accesskey很好使用，但它的实现很快就被破坏了。它可能与浏览器自己的热键冲突，然后对您不利。

<input type="text" size="40" value="somefield" accesskey="F">

<div id="foo" tabindex="1" accesskey="F">