时间戳

首页 > 解决方案 > 当输入填充 1 个整数时自动移动到下一个选项卡

javascript - 当输入填充 1 个整数时自动移动到下一个选项卡

问题描述

填充 1 个整数时如何移动到下一个输入字段。当我在输入字段中输入整数时，它不会移动到下一个输入字段

jq = $

jq(".pc").keyup(function() {
  var nextItem = parseInt(this.id) + 1;
  console.log(nextItem);
  jq(this).next('.pc').focus();
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-md-2">
  <input class="form-control pc" id="1" type="text" name="pc1" />
</div>
<div class="col-md-2">
  <input class="form-control pc" id="2" type="text" name="pc2" />
</div>
<div class="col-md-2">
  <input class="form-control pc" id="3" type="text" name="pc3" />
</div>

标签： javascriptjquerykeyup

解决方案

pc不是兄弟姐妹，你需要去父母那里然后去它的兄弟姐妹那里找到.pc

所以你需要使用 $(this).parent().next().find('.pc').focus();

$(".pc").on('keyup', function() {
  const nextItem = parseInt(this.id) + 1;
  $(this).parent().next().find('.pc').focus();
  console.log(nextItem);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-md-2">
  <input class="form-control pc" id="1" type="text" name="pc1" />
</div>
<div class="col-md-2">
  <input class="form-control pc" id="2" type="text" name="pc2" />
</div>
<div class="col-md-2">
  <input class="form-control pc" id="3" type="text" name="pc3" />
</div>

推荐阅读