javascript - 使用键盘按钮提交网页？

Question

我的简单 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 代码。最简单的方法是什么？

Answer 1

您可以添加按键侦听器，并根据按下的按键调用适当的函数。

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

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

你可以在这里看到代码：http ://www.quirksmode.org/js/keys.html

使用 Javascript

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

Answer 2

你可以试试这个

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复位。此外，您可以更改键，如果您想s为功能设置键，start则相应地更改keys对象中的键，但一个键应该用于一个功能。

演示。

Answer 3

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

Answer 4

使用快捷键 jquery 插件ShortKey Plugin

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