在 Chrome 浏览器中管理 JavaScript 热键

Question

我在我建立的网站上有以下 jQuery 代码：

$(document).ready(function() {
  // Other Bindings/Initializations Removed

  // Hotkey Event Handler to 'doSomething'
  //-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
  $(document).keypress("a",function(e) {
    if(e.altKey) { // Doesn't work
      doSomething();
    }
  });

  // Hotkey Event Handler to 'doSomething'
  //-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
  $(document).keypress("a",function(e) {
    if(e.shiftKey) { //Works as Expected?
      doSomething();
    }
  });

});

代码捕获按键组合事件，在本例中为“Alt-A”，然后继续调用执行适当操作的函数。我在 FireFox 中测试了此功能，并按预期调用了该功能。当我在 Chrome 中测试该功能时，该功能未被调用，而是发出了令人讨厌的错误提示音。我认为也许“Alt-A”与一个重要的浏览器热键组合发生冲突，因此将“A”更改为“N”、“G”，然后是“K”；每次未调用该函数并发出错误音时。但是，当我创建 Shift-A/N/G/K 热键组合时，Chrome 按预期调用了该功能。

1. 为什么 Chrome 处理“Alt”键的方式不同？

2. 如何为我的网站定义一个热键，以便它可以使用“Alt”键在 Chrome 中运行？

Answer 1

这在 Chrome 和 Firefox 中有效，但在 IE 中 Alt+a 打开收藏夹菜单。我不确定你会如何覆盖它。

Fiddle

HTML：

<a accesskey="a">​

Javascript：

$(document).ready(function() {
    // Other Bindings/Initializations Removed
    // Hotkey Event Handler to 'doSomething'
    //-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
    $(document).keypress("a", function(e) {

        if (e.shiftKey) { //Works as Expected?
            alert("shift a");
        }

        if (e.altKey) {
            alt_a_function();
        }

    });

    $(document).on("click", "[accesskey=a]", function() {
        alt_a_function();
    });

});

function alt_a_function() {
    alert("alt a");
}​

Answer 2

jQuery 文档说.keypress() 的第一个参数是“将传递给事件处理程序的数据映射”。当该对象是字符串时，jQuery 可能会感到困惑，这会导致 Chrome 出错。

要检查事件处理程序中的特定键，请改用e.which 来获取字符代码。