使用键盘按钮提交网页？ [复制]答案

【问题标题】：Submitting web using keyboard buttons? [duplicate]使用键盘按钮提交网页？ [复制]
【发布时间】：2013-06-18 22:31:00
【问题描述】：

我的简单 html 网页上有几个按钮调用了一些 javascript：

  <input type="image" src="button_start.png" onClick="start();">
  <input type="image" src="button_stop.png" onClick="stop();">
  <input type="image" src="button_reset.png" onClick="reset()">

我想要的是能够按下三个单独的键盘键，然后让它们“按下”按钮或调用 javascript 代码。最简单的方法是什么？

【问题讨论】：

谢谢尼罗河。我搜索了，但显然不够好。我最终在这里修改了 op 的代码：stackoverflow.com/a/4929676/2509899，效果很好。

标签： javascript html button

【解决方案1】：

您可以监听 keydown 事件，并且可以使用 keycode 来识别按下哪个键来执行功能。见https://developer.mozilla.org/en-US/docs/Web/API/event.keyCode

【讨论】：

【解决方案2】：

您可以添加按键监听器，并根据按下的按键调用相应的函数。

然而，由于安全原因，实际调度/模拟按钮点击事件非常困难。

下面是一个使用 javascript 的示例，当按下 keycode 13 的键时将调用 start()。

您可以在此处查看代码：http://www.quirksmode.org/js/keys.html

使用 Javascript

window.addEventListener('keypress', function (e) {
    if (e.keyCode !== 13) {
        start();
    }
}, false);

【讨论】：

你为什么要推荐 jQuery...？
你说得对，这有点矫枉过正。

【解决方案3】：

使用快捷键 jquery 插件ShortKey Plugin

$(document).shortkeys({
  's': function () { start(); },'o': function () { stop(); },'r': function () { reset(); }
});

【讨论】：

-1，未调用的jQuery使用
@Nile 我不明白怎么了？
你正在使用 jQ 但 OP 没有要求它

【解决方案4】：

你可以试试这个

window.addEventListener('load', function(e){
    var keys = { 't' : 'start', 's' : 'stop', 'r' : 'reset' };
    window.addEventListener('keypress', function (e){
        var fn = String.fromCharCode(e.which||e.keyCode);
        if(fn in keys) window[keys[fn]]();
    });
});

按t 开始，s 停止，r 重置。此外，您可以更改键，如果您想为start 功能设置s 键，则相应地更改keys 对象中的键，但一个键应该用于一个功能。

DEMO.

【讨论】：