选择next()输入

时间:2011-12-12 23:07:03

标签: jquery

我有以下html:

<div>
    <input type="text" maxlength="2" class="day-spin-month"></input>
    <span>/</span>
    <input type="text" maxlength="2" class="day-spin-day"></input>
    <span>/</span>
    <input type="text" maxlength="4" class="day-spin-year"></input>
</div>

我正在尝试将焦点更改为下一个输入。我有以下两种方式工作。

$('.day-spin-month').on('keyup', function () {
    if (this.value.length >= 2) {
       $(this).next().next().focus();
    }
});
$('.day-spin-day').on('keyup', function () {
    if (this.value.length >= 2) {
       $(this).next().next().focus();
    }
});

小提琴:http://jsfiddle.net/dan_vitch/JbQaN/1/

$('.day-spin-month').on('keyup', function () {
    if (this.value.length >= 2) {
       var test=$(this).next()
       var test2=  $(test).next('input');
       test2.focus();
     }
});
$('.day-spin-day').on('keyup', function () {
    if (this.value.length >= 2) {
        var test=$(this).next()
        var test2=  $(test).next('input');
        test2.focus();
    }
});

小提琴:http://jsfiddle.net/dan_vitch/JbQaN/2/

但它不会这样:

$('.day-spin-month').on('keyup', function () {
    if (this.value.length >= 2) {
       $(this).next('input').focus();
    }
});
$('.day-spin-day').on('keyup', function () {
    if (this.value.length >= 2) {
       $(this).next('input').focus();
    }
});

小提琴:http://jsfiddle.net/dan_vitch/rJwyE/2/

我想使用不起作用的方式。我不确定它的选择器是不正确的,还是我理解的方式()

1 个答案:

答案 0 :(得分:56)

.next()只关注DOM中的下一个兄弟元素。 IE浏览器。

$('.day-spin-month').next('input');

不会匹配任何内容,因为下一个兄弟是一个跨度,而不是输入。

nextAll()查看所有下一个兄弟姐妹,所以你想要:

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