Cambio índice seleccionado usando jQuery

Question

Hola necesidad de cambiar el índice seleccionado de un cuando otro ha cambiado .. Ejemplo: que tengo

<select id="selector"> 
<option>No 1</option> 
<option>No 2</option> 
</select> 
<select id="selected"> 
<option>ONE</option> 
<option>TWO</option> 
</select> 

ahora quiero el índice $ seleccionada para cambiar cuando el # de selector el índice se cambia ... como cuando cambio a "No 2", el otro cuadro combinado cambiará a "DOS". perdón para la pregunta novato pero im nuevo en jQuery ^^

Answer 1

$('#selector').change(function() { 
    var idx = this.selectedIndex;   
    $("select#selected").prop('selectedIndex', idx); 
}); 

Answer 2

me gustaría sugerir:

$('#selector').change(
    function(){ 
     var index = this.selectedIndex; 
     $('#selected option').eq(index).prop('selected',true); 
    }); 

JS Fiddle demo.

Referencias:

• change().
• eq().
• prop().

Answer 3

Sólo uso de JavaScript jQuery regular porque parece innecesario para esto:

document.getElementById('selector').onchange = function() { 
    document.getElementById('selected').selectedIndex = this.selectedIndex; 
} 

Working DEMO

Answer 4

con jQuery 1.7.2

$(document).on('change', '#selector', function(){ 
    var si = this.selectedIndex 
    $('#selected option').eq(si).prop('selected',true); 
});​ 

Working DEMO

Answer 5

El selectedIndex comienza en 0.

Si la lista desplegable permite seleccionar varias opciones que sólo devolverá el índice de la primera opción seleccionada.
El valor "-1" anulará la selección de todas las opciones (si las hay).
Si no se selecciona ninguna opción, la propiedad selectedIndex devolverá -1.

$('#idselect').change(function() { 
    var index = this.selectedIndex; 
    //... 
});