如何将焦点设置为下一个文本字段

How to Set focus to next text field

本文关键字：下一个 文本 字段 设置 焦点      更新时间：2023-09-26

我制作了一个表格，通过USB条形码读取器输入产品代码。java脚本或jquery中是否有通过USB条形码读取器扫描产品代码后自动聚焦到下一个字段的机制，反之亦然。

例如：通过条形码阅读器扫描产品代码后，光标将逐个聚焦。超级市场流程类型。

但产品代码大小并不相同。有些产品代码包含10位数字，有些产品代码则包含20位数字。

您可以使用javascript .focus方法来聚焦输入元素。就像这样：如果使用jQuery，则为document.querySelector("#inputId").focus()或$("inputId").focus()。

您可以使用inputjs事件来侦听更改。转到http://jsfiddle.net/67sgxcyz/以查看示例。一旦你改变了第一个输入，你就会专注于第二个输入。

这里有一个例子，我使用一个变量(currentInput(来跟踪哪个输入是当前输入。当我们更改输入时，我们会将注意力集中在下一个输入上。这个例子非常原始，因为当您手动选择任何输入时，currentInput变量都不会更改。http://jsfiddle.net/snytcfz0/(你可以用纯JS写所有这些，但我太懒了(

或者，您可以不使用事件侦听器来触发焦点，而只需在管理产品代码的函数中设置内容后运行它。像这样：

    var currentInput
    function scanBarCode (code) {
        $('input')[currentInput].value = code
        currentInput++
        $('input')[currentInput].focus()
    }
相关文章：