javascript - 当没有兄弟时，用 jquery 查找下一个

Question

在输入中输入 maxlength 个字符后，我需要关注下一个输入。问题是下一个输入并不总是同级:

jQuery("input").on('input', function() {
  if (jQuery(this).val().length == jQuery(this).attr('maxlength')) {
    jQuery(this).next("input").focus();
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
When you have write 4 char, the focus have to switch to the next input:
<div>
  OK
  <input maxlength="4">
  <input maxlength="4">
</div>
KO
<input id="inputWithTheIssue">

Answer 1

您不能使用.next() 函数，因为所有输入 都不是同级。因此，您需要在整个输入控件集中找到当前输入的索引，并将其加1以找到下一个出现的输入元素。

jQuery("input").on('input',function () {
            if(jQuery(this).val().length == jQuery(this).attr('maxlength')) {
              var currIndex = $(this).index();  // gets the index value w.r.t the other input controls
              $('input').eq(currIndex + 1).focus();
            }
        });

工作示例:https://jsfiddle.net/DinoMyte/uhpn7pyx/2/