Javascript 将数据扫描到mvc web应用程序中，然后更改焦点

我正在写一个小数据库，我可以扫描到不同的文本框多个条码，然后保存数据。条形码数据的长度可能会有一些变化，我想在扫描完条形码后将焦点移到下一个文本框

下面是我视图中的最新代码，我给每个文本框一个id，然后在第一个文本框达到一定长度后使用jquery关注下一个id

<!--This is for entering the PartNumber-->
<div class="form-group">
    @Html.LabelFor(model => model.PartNum, 
       htmlAttributes: new { @class = "control-label col-md-2" })
    @Html.TextBoxFor(model => model.PartNum, 
       new { htmlAttributes = new { @class = "form-control", id="focus1"} })
    @Html.ValidationMessageFor(model => model.PartNum, "", 
       new { @class = "text-danger" })
</div>

        <!--This is for entering the Aisle-->
        <div class="form-group">
            @Html.LabelFor(model => model.Aisle, 
               htmlAttributes: new { @class = "control-label col-md-2" })
            @Html.TextBoxFor(model => model.Aisle, 
                new { htmlAttributes = new { @class = "form-control",id="focus2" } })
            @Html.ValidationMessageFor(model => model.Aisle, "", new { @class = "text-danger" })
        </div>

从代码中可以看出，在第一个文本框中输入/扫描2个字符后，应该将焦点移到下一个文本框，但这不起作用

然后，我想在扫描可变长度的条形码后更改焦点，但不确定如何执行此操作

我在代码中犯了什么错误，使焦点无法切换到下一个文本框？

更新：

您可以尝试以下方法：

$('input[id*="focus"]').each(function () {
     if($(this).val().length >= 2) {
          $(this).next().focus();
     }
});

我不确定您的结构，但是jQuery非常简单。使用单词

focus

遍历每个元素，如果值大于2，则将焦点移动到下一个元素。（可能需要调整下一步以命中正确的元素）

这也会有一些开销，因为每次迭代都会出现一个循环

---

我不确定是否会触发

keyup

事件。另外，您需要确保它等于2，而不是等于或大于2。不过，您可以执行以下操作：

$('input[id=focus]).change(function (event) {
     event.preventDefault();
     if($(this).val().length >= 2) {
          $('input[id=focus2]').focus();
     }
});

---

您可能还希望缩放此代码，它会自动递增到下一个可用的

id

以进行聚焦。

我发现我遇到的主要问题是我忘了包括

$（函数（）{

在我的代码的开头。 关于我能够解决的主要问题

$(function(){
    $('#focus1').keyup(function(){
        if(!_timeoutRunning){
            _timeoutRunning=true;
            setTimeout(function(){checkKey();}, 2000);
        }
    });
});

var _timeoutRunning = false;

function checkKey(){
    _timeoutRunning = false;
    if($('#focus1').val().length >= 7)
        $('#focus2').focus();
}

---

此代码允许我在扫描第7个字符后扫描长度为7秒或超过2秒的条形码，它会将焦点更改为下一个id

您确定扫描仪甚至触发了

keyup

事件吗？我不确定是否触发。在应用程序的另一部分，我将条形码扫描到带有id然后在keyup事件之后，长度为7个字符，我让jquery单击输入提交，应用程序将提交数据并加载下一页。我知道这是使用click而不是focus，但我认为这是相同的概念。我也不确定是否触发了keyup。我在我的p项目中，在文本框中输入一定数量的字符后，我使用jquery单击submit按钮。是否有办法更改代码以触发keyup事件？@GregNot当然，这就是我建议更改的原因。因为如果您这样做：

$（“…”）.val（'Example'））；

这不会触发

键控

。我第一次运行它时错过了更改部分。但在修复后，我仍然得到了与以前相同的结果（焦点不会更改为下一个文本框）。当我将“@Html.TextBoxFor（model=>model.PartNum…”更改为“@Html.TextBox（“PartNum”…”时使用我的原始脚本，我可以更改焦点，但这需要更改我在控制器中处理数据的方式。嗯，我有一个想法，但不确定如何让您轻松实现。@vanderpm我想到了一个想法，不确定您的确切用法，因此它可能不理想，但可能是一个可靠的解决方案。

$(function(){
    $('#focus1').keyup(function(){
        if(!_timeoutRunning){
            _timeoutRunning=true;
            setTimeout(function(){checkKey();}, 2000);
        }
    });
});

var _timeoutRunning = false;

function checkKey(){
    _timeoutRunning = false;
    if($('#focus1').val().length >= 7)
        $('#focus2').focus();
}