填充4个字符后如何移动下一个输入选项卡

Posted 2023-02-25

【中文标题】填充4个字符后如何移动下一个输入选项卡

【英文标题】：how to move next input tab after fill 4 characters

【发布时间】：2014-05-27 05:38:49

【问题描述】：

我还有一个问题，如果我需要更改第二个或第三个字段的数字，我已经填写了所有字段。无法进行更改，它会进入最后一个输入字段。

我试过下面的代码，

    (function ()
$("#num1, #num2, #num3, #num4").on("keyup", function (t) 
    //add the key's you want to accept such as backspace or arrow keys etc.
    if (t.keyCode != 13 && t.keyCode != 8 && t.keyCode != 37 && t.keyCode != 38 && t.keyCode != 39 && t.button != 1 && t.button != 2 && t.button != 3) 
    var maxlength = 4;
    var num1 = $("#num1").val().length;
    var num2 = $("#num2").val().length;
    var num3 = $("#num3").val().length;
    var num4 = $("#num4").val().length;
    $(this).val($(this).val().replace(/[^0-9\.]/g,''));

    if ( num1 >= 4) 
    $("#num2").focus();
    
    if( num2 >= 4)
      $("#num3").focus();
    
    if( num3 >= 4)
      $("#num4").focus();
    

    if (num4>=4)
       $("#num4").val($("#num4").val().substr(0,4));
    
    

  );   
)();

【问题讨论】：

Visit to Demo

查看这个链接，这里已经回答了，可能对你有帮助***.com/questions/10539113/…

你的代码有什么问题？您的演示与发布的代码不同。

我用 4 个字符填充了所有输入字段，然后如果我需要更改第二个字段或第三个字段，指针转到最后一个字段。

【参考方案1】：

您粘贴的代码有错误的 if 语句。让我们试着理解这个问题。以下是您的代码的工作方式

在第一个字段中输入值。达到四个字符转到下一个。在第二个字段中输入。达到四个字符转到下一个。在第三个字段中输入。达到四个字符转到下一个。在第四个字段中输入。达到四个字符停止。

现在的问题是当您开始编辑时。当您编辑第二行时。您的 if 命令同时告诉检查第三行和第四行。因此，如果第三行有四个字符，则转到第四行。如果第四行有四个字符停止。因此，除非您删除第三行和第四行中写入的任何内容，否则您无法编辑第二行。

Bhavesh 共享的以下链接正是您想要的。根据需要将最大限制增加到 4。但我希望你能明白问题出在哪里，这样你以后就不会犯类似的错误了。

$(".inputs").keyup(function () 
  if (this.value.length == this.maxLength) 
    $(this).next('.inputs').focus();
  
);

JSFIDDLE LINK

【讨论】：

你为什么要赚钱

哪里说 type=numbers？

【参考方案2】：

我很忙，但是我用简单的方法解决了你的问题..

把你的 Jquery 改成这个

(function ()
$("#num1, #num2, #num3, #num4").on("keydown", function (t) 
    //add the key's you want to accept such as backspace or arrow keys etc.
    if (t.keyCode != 13 && t.keyCode != 8 && t.keyCode != 37 && t.keyCode != 38 && t.keyCode != 39 && t.button != 1 && t.button != 2 && t.button != 3) 
    var maxlength = 4;
    var num1 = $("#num1").val().length;
    var num2 = $("#num2").val().length;
    var num3 = $("#num3").val().length;
    var num4 = $("#num4").val().length;
    $(this).val($(this).val().replace(/[^0-9\.]/g,''));

    if (num1 >= 4) 
    $("#num2").focus();
    
    if(num1 >= 4 && num2 >= 4)
      $("#num3").focus();
    
    if((num1 >= 4 && num2 >= 4) && num3 >= 4)
      $("#num4").focus();
    

    if ((num1 >= 4 && num2) && (num3 >= 4 && num4))
            $("#num4").val($("#num4").val().substr(0,3));
    
    

  );   
)();

http://jsfiddle.net/j42Jx/9/

【讨论】：

谢谢，如果我开始输入值会有一个问题，因为第二个字段可以输入四个以上的字符。如何解决这个问题？