使用jQuery來創建它選擇一個下拉選項

Question

鏈接這個問題脫落另一個問題在這裏：use jquery to select a dropdown option

但是我下面這個例子中，我不明白，在頂端回答示範

$('select>option:eq(3)').attr('selected', true);

http://www.jsfiddle.net/gaby/CWvwn/

的答案都不提供的鏈接代碼，使用戶可以通過點擊它來改變下拉選項。鏈接看起來像使用這個腳本是什麼？

Answer 1

一個可能的選擇是使用nth-child僞選擇這樣的：

$('select::nth-child(2)').attr('selected', true); 

或者，如果選擇正確完成，像這樣：

<select> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
</select> 

您可以通過value屬性選擇：

$('select>option[value=4]').attr('selected', true); 

---

既然你一定會希望有更多的聯繫，這是很方便的定義一個函數：

JS

function showOptWithValue(which) { 
    $('select>option[value=' + which + ']').attr('selected', true); 
} 

現在，這個功能綁定到你的鏈接，您可以使用onclick ：

HTML

<a href="#" onClick="showOptWithValue(3); return false;">The Link</a> 

或分配純jQuery的單擊處理：

HTML

<a href="#">The Link</a> 

JS

$('a').on('click', function(){ 
    showOptWithValue(3); 
    return false; 
}); 

這裏是的jsfiddle一些工作示例：http://jsfiddle.net/FY3tz/1/

Answer 2

這裏你去：DEMO

$('.link').click(function() { 
    $('select>option:eq(3)').attr('selected', true); 
}); 

Answer 3

//html 

<a id="myLink" href="#">My link</a> 
<select> 
    <option>1</option> 
    <option>2</option> 
    <option>3</option> 
    <option>4</option> 
    <option>5</option> 
</select> 

//js 

$('#myLink').click(function() { 
    $('select>option:eq(3)').attr('selected', true); 
}) 

Answer 4

<select> 
     <option>1</option> 
     <option>2</option> 
     <option>3</option> 
     <option>4</option> 
     <option>5</option> 
    </select> 


    <a id="btn-change-option" data-option="2" href="#">Change to 3</a> 

    <script> 

    $("#btn-change-option").click(function(){ 

     // get option to select from the data attribute of your link 
     var optionToSelect = $(this).data('option'); 

     $('select>option:eq('+optionToSelect +')').attr('selected', true); 

    }) 

    </script>