Selección siguiente entrada()

Question

Tengo el siguiente código 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> 

Estoy intentando cambiar el foco a la siguiente entrada. Lo tengo trabajando de las 2 formas siguientes.

$('.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(); 
    } 
}); 

violín: 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(); 
    } 
}); 

violín: http://jsfiddle.net/dan_vitch/JbQaN/2/

pero no funciona de esta manera:

$('.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(); 
    } 
}); 

violín: http://jsfiddle.net/dan_vitch/rJwyE/2/

Me gustaría utilizar el camino que no funciona. No estoy seguro de si mi selector es incorrecto, o de la manera que entiendo a continuación()

Answer 1

.next() solo mira el siguiente elemento hermano en el DOM. ES DECIR.

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

No coincidirá con nada, ya que el siguiente hermano es un tramo, no una entrada.

nextAll() mira a todos los hermanos próximos, por lo que desea:

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