基於點擊鏈接

Question

我想基於其上

<a id="1" href="#1">number 1</a> 
<a id="2" href="#2">number 2</a> 
<a id="3" href="#3">number 3</a> 

<select id="dropdown"> 
    <option value="option one">option one</option> 
    <option value="option two">option two</option> 
    <option value="option three">option three</option> 
</select> 

鏈接，用戶點擊。當我的用戶點擊數2鏈接以改變在下拉列表中選擇的值jQuery的變化下拉，我想下拉顯示選項二。任何幫助是極大的讚賞。

我已經使用。點擊函數中.prop和.VAL嘗試過，但還沒有任何運氣

預先感謝您

Answer 1

添加data-option屬性鏈接。這個屬性的值應該對應於你想要的option的值來選擇：

<a id="1" href="#1" data-option="option one">number 1</a> 
<a id="2" href="#2" data-option="option two">number 2</a> 
<a id="3" href="#3" data-option="option three">number 3</a> 

連接click監聽到你的鏈接。它裏面獲得點擊鏈接的data-option值，使用它，找到option要選擇：

$(document).on("click", "a", function(e){ 
    //get clicked value 
    var option = $(this).attr("data-option"); 

    //find the option to select 
    var optionToSelect = $("#dropdown").children("[value='" + option + "']"); 

    //mark the option as selected 
    optionToSelect.prop("selected", "selected"); 
    return false; 
}); 

演示是HERE

Answer 2

，您可以定位索引值只是選擇的選項。這是一個很大整潔和最小碼

$('a').on('click', function(){  
    var id = this.id; 
    $('#dropdown')[0].selectedIndex = id - 1; 
}); 

JSFIDDLE

Answer 3

另一種方法是這樣的：

$('a').on('click', function(){  

    var id = this.id; 

    switch(n) { 

     case '1': 
      $('#dropdown').selectedIndex = 0; 
     break; 

     case '2': 
      $('#dropdown').selectedIndex = 1;  
     break; 

     case '3': 
      $('#dropdown').selectedIndex = 2; 
     break; 

    } 

});