为您的HTML5应用程序创建键盘快捷方式？

Question

如何为HTML5应用程序创建键盘快捷方式？使用按键事件不起作用，因为某些浏览器已经为内置功能（如“另存为...”）定义了大部分这些输入内容，而对于交互式应用程序来说这些无用。

- MaiaVictor

---

你需要展示你尝试过哪些方法，以及你不喜欢哪些方法，因为有很多浏览器没有使用的快捷方式。 - Ruan Mendes

Answer 1

好的，这个对我有效：（在Chrome中按CTRL-S）

$(document).keydown(function(evt){
    if (evt.keyCode==83 && (evt.ctrlKey)){
        evt.preventDefault();
        alert('worked');
    }
});

- apoq

---

是的，关键在于使用event.preventDefault()。但有些快捷方式在某些浏览器中无法工作，而其他浏览器则无法正常工作。 - lordvlad

我理解你的观点，ctrl-s会在FF中弹出保存对话框并发出警报，但正如Juan Mendes上面提到的，你应该使用任何浏览器都没有使用的快捷键或为不同浏览器的热键设置别名。我绝对看不到其他方法，因为Web应用程序无法覆盖内置函数。也许你应该考虑编写插件来解决这个问题。 - apoq

当然，event.preventDefault()确实是我错过的关键点。我可以问一下你的解决方案是否跨浏览器（也就是说，在规范上）？ - MaiaVictor

不是的。我想我在上面的评论中提到过 :) - apoq

这是有道理的，因为 keydown 会多次触发。代码很简洁。 - www139

使用 keypress 替代，因为它是默认浏览器事件程序使用的。 - Supreme Dolphin

Answer 2

试着看一下这个。

http://www.openjs.com/scripts/events/keyboard_shortcuts/#add_docs

添加快捷方式的示例

shortcut.add("Ctrl+B",function() {
alert("Bold");});

删除快捷方式的示例

shortcut.remove("Ctrl+B");

- wildcards

---

shortcut.js非常慢，打字简直是噩梦。 - Supreme Dolphin