jquery - 使用 jquery 更改选定的索引

Question

嗨，当另一个已更改时，您需要更改 a 的选定索引。示例：我有

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

现在我希望在#selector 的索引更改时更改 $selected 索引。就像当我更改为“No 2”时，另一个组合框将更改为“TWO”。请原谅我的新手问题，但我是 jquery 的新手^^

Answer 1

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

Answer 2

我建议：

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

JS 小提琴演示。

参考：

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

Answer 3

只使用常规 JavaScript，因为 jQuery 似乎不需要这样做：

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

工作演示

Answer 4

使用jQuery 1.7.2

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

工作演示

Answer 5

selectedIndex 从 0 开始。

如果下拉列表允许多选，它将仅返回所选第一个选项的索引。
值“-1”将取消选择所有选项（如果有）。
如果未选择任何选项，则 selectedIndex 属性将返回 -1。

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