检测到跨度时未选择下一个输入元素

Question

我在2个span块内有一组输入元素。 我需要通过使用onKeup（）自动选择下一个输入元素。 在找到span标记之前，它可以正常工作。 之后，它没有检测到。

在下面的代码中，将检测到下一个输入元素，直到第三个输入框都没有被检测到为止。

有人能帮忙吗？

http://jsfiddle.net/et3escuh/8/

<span>
<input id="opnamenummer6" class="form-control" type="text" name="opnamenummer6" value="" maxlength="1">
<input id="opnamenummer7" class="form-control" type="text" name="opnamenummer7" value="" maxlength="1">
<input id="opnamenummer8" class="form-control" type="text" name="opnamenummer8" value="" maxlength="1">
</span>


<script type="text/javascript">
$('input[class*="form-control"]').keyup(function(event) {
    var $this = $(this);
    var currentLength = $this.val().length;
    var maximumLength = $this.attr('maxlength');
    // if we've filled up this input, go to the next if only numerics are entered.
    if ( (currentLength == maximumLength) && ((event.which >= 48 && event.which <= 57) || (event.which >= 96 && event.which<= 105))) {
        $this.next().select();
    }
    //go to previous input if Backspace or Delete buton is pressed
    if(event.which == 8 || event.which == 46) {
        $(this).val('');
        $(this).prev('input').select();
    }
});

</script>

Answer 1

不要使用next() ，请使用eq()并在索引中添加或减去

$('input[class*="form-control"]').keyup(function(event) {
    var $this = $(this);
    var currentLength = $this.val().length;
    var maximumLength = $this.attr('maxlength');

    if ( (currentLength == maximumLength) && (!isNaN(this.value))) {
        $('input').eq($(this).index('input') + 1).select();
    }

    if(event.which == 8 || event.which == 46) {
        $(this).val('');
        $('input').eq($(this).index('input') - 1).select();
    }
});

小提琴