1

当按下输入时，我正在使用这个 jQuery 脚本来关注下一个输入：

  $(function() {
    $(".form >input").on('keyup', function(e) {
      if (e.which === 13) {
        $(this).next('input').focus();
      }
    });
  });

它确实适用于这个基本的瘦 HTML 表单

<div class="form">
  <input type="text" />
  <input type="text" />
  <input type="text" />
  <input type="text" />
  <input type="text" />
  <input type="text" />
</div>

但不是这个

<div class="form">
    <input name="cislo1" type="text" class=cislo1 placeholder="" id="cislo1" autofocus /><br>
    <input name="cislo2" type="text" class=cislo2 placeholder="" id="cislo2" /><br>
    <input name="cislo3" type="text" class=cislo3 placeholder="" id="cislo3" /><br>
    <input name="cislo4" type="text" class=cislo4 placeholder="" id="cislo4" /><br>
    <input name="cislo5" type="text" class=cislo5 placeholder="" id="cislo5"  /><br>
    <input name="cislo6" type="text" class=cislo6 placeholder="" id="cislo6" /><br>
    <input name="cislo7" type="text" class=cislo7 placeholder="" id="cislo7" /><br>
    <input name="cislo8" type="text" class=cislo8 placeholder="" id="cislo8" /><br>
    <input name="cislo9" type="text" class=cislo9 placeholder="" id="cislo9" /><br>
    <input name="cislo10" type="text" class=cislo10 placeholder="" id="cislo10" /><br>
    <input name="cislo11" type="text" class=cislo11 placeholder="" id="cislo11" /><br>
</div>

这里似乎有什么问题？请帮帮我，我卡住了

4

1 回答 1

1

这里的问题是您正在使用直接子选择器，例如：

$(".form > input")

这仅匹配类input内的任何直接元素form，但在您的下一个示例input中不是直接子元素。所以，你需要下降扇区，而不是像：

$(".form input")

这将匹配类中是否为直接子级的任何input内容。form

另外，你需要更换

$(this).next('input').focus();

有了这个：

$(this).nextAll('input:first').focus();

这是必需的，因为.next()将获得每个元素的紧随其后的兄弟，但这里input不是直接的兄弟。我们还有一些<br>介于两者之间的问题。这可以通过使用.nextAll('input:first')来解决。

演示：

$(function() {
  $(".form input").on('keyup', function(e) {
    if (e.which === 13) {
      $(this).nextAll('input:first').focus();
    }
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form">

  <p class="cislo">
    <input name="cislo1" type="text" class=cislo1 placeholder="" id="cislo1" autofocus onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')" oninput="cislo1.value=cislo1.value.slice(0,2)" /><br>
    <input name="cislo2" type="text" class=cislo2 placeholder="" id="cislo2" onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')" oninput="cislo2.value=cislo2.value.slice(0,2)" /><br>
    <input name="cislo3" type="text" class=cislo3 placeholder="" id="cislo3" onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')" oninput="cislo3.value=cislo3.value.slice(0,2)" /><br>
    <input name="cislo4" type="text" class=cislo4 placeholder="" id="cislo4" onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')" oninput="cislo4.value=cislo4.value.slice(0,2)" /><br>
  </p>

</div>

于 2020-06-10T14:38:37.457 回答