dom events -如果没有字段被聚焦，则在键盘输入时触发JavaScript

dom events - Fire JavaScript at keyboard entry if no field is focused

本文关键字：输入 键盘 JavaScript events 如果没有 字段 聚焦 dom      更新时间：2023-09-26

我正在尝试编程一个网页，让用户使用条码扫描器来制作购买的产品列表。因为条形码扫描器通常模拟正常的键盘输入，所以这没什么特别的。

无论如何，我发现很多人在使用条形码扫描器时不看屏幕，因此经常没有意识到光标没有集中在条形码输入字段上。

因此，我尝试在每次有键盘输入并且没有字段集中在网页上时触发JavaScript(播放声音)。

但是我被困住了:

  1. 我怎样才能使JavaScript只触发一次，即使10个键在另一个键之后不久被按下(它应该只播放一次声音每个扫描的条形码，而不是每个数字)。
  2. 如何处理"无字段聚焦"问题?是否有一种方法可以从DOM获得这些信息?或者我必须检查页面上的每个字段是否有焦点?这将是不方便的，因为其他字段的数量(除了条形码输入字段)可以变化。

下面是一些代码，它将执行"即使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/

如何使javascript只触发一次，即使在另一个

之后不久按了10个键

你不能那样做。

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

我该如何解决"不关注领域"的问题?

测试事件。目标使用绑定到document对象的事件处理程序。

或者，将keydown事件绑定到每个输入(并确保它调用event. stoppropagation)。将"no input focused"代码绑定到document对象上的keydown

相关文章：