如果没有关注任何字段，则在键盘输入时触发 javascript答案

【问题标题】：fire javascript at keyboard entry if no field is focused如果没有关注任何字段，则在键盘输入时触发 javascript
【发布时间】：2013-01-08 07:02:09
【问题描述】：

我正在尝试编写一个网页，让用户使用条形码扫描仪来列出所购买的产品。由于条码扫描器通常模拟普通的键盘输入，这没什么特别的。

反正我发现很多人在使用条码扫描器时不看屏幕，因此经常没有意识到光标没有聚焦在条码输入字段上。

因此，每当有键盘输入且网页上没有焦点字段时，我都会尝试触发 javascript（播放声音）。

但是我被卡住了： 1）如何让javascript只触发一次，即使10个键被按下一个又一个（它应该每个扫描的条形码只播放一次声音，而不是每个数字）。 2）我该如何解决“没有专注于领域”的问题？有没有办法从 DOM 中获取这些信息？或者我是否必须检查页面上的每个字段是否有焦点？这会很不方便，因为其他字段（条形码输入字段除外）的数量可能会有所不同。

感谢您的帮助。

本尼迪克特。

【问题讨论】：

你想测试一下，是否有任何输入字段被聚焦或某个特定的字段是否被聚焦？

标签： javascript javascript-events

【解决方案1】：

下面是一些代码，它将执行“即使连续按下 10 个键也只执行一次”部分。

它使用计时器在 1 秒后重置计数器。如果在这一秒内按下另一个按钮，计时器将重新启动，因此它不会意外重置计数器。出于测试目的，我将阈值设置为 3 秒而不是 10 秒，您可以随意更改。

(function () {
    var counter = 0,
        timer,
        threshold = 3;


    document.addEventListener('keydown', function () {

        window.clearTimeout(timer);

        counter += 1;

        if (counter >= threshold) {
            console.log('do whatever you want');
            counter = 0;
        }

        timer = window.setTimeout(function () {
            counter = 0;
        }, 1000);

    });
})()

http://jsfiddle.net/gJC3M/2/

【讨论】：

【解决方案2】：

我怎样才能让 javascript 只触发一次，即使 10 个键被按下一个又一个

你不能这样做。

相反，在函数触发时将变量设置为 true，并在 X 秒后使用 setTimeout 将其设置为 false。在事件处理函数的顶部，测试该变量是否为真，如果是则立即返回。

我该如何解决“没有专注于领域”的问题？

使用绑定到document 对象的事件处理程序测试event.target。

或者，将 keydown 事件绑定到每个输入（并确保它调用 event.stopPropagation）。将您的“无输入重点”代码绑定到 document 对象上的 keydown。

【讨论】：