如何使用jQuery設置DropDownList的值？

Question

如問題所述，如何使用jQuery設置DropDownList控件的值？

Answer 1

$("#mydropdownlist").val("thevalue"); 

只要確保選項標記中的值與val方法中的值匹配。

Answer 2

如果索引工作，就可以使用.attr（）直接設置選擇指數：

$("#mydropdownlist").attr('selectedIndex', 0); 

這將其設置爲在droplist的第一個值。

編輯： 我上面的方式用於工作。但它似乎已經不再。

但隨着韓立如此愉快的評論指出，做正確的做法是：

$("#mydropdownlist").get(0).selectedIndex = index_here; 

Answer 3

試試這個非常簡單的方法：

/*make sure that value is included in the options value of the dropdownlist 
e.g. 
(<select><option value='CA'>California</option><option value='AK'>Alaska</option>  </select>) 
*/ 

$('#mycontrolId').val(myvalue).attr("selected", "selected"); 

Answer 4

如果你的下拉是Asp.Net然後下面的代碼將工作正常，

$("#<%=DropDownName.ClientID%>")[0].selectedIndex=0; 

但是，如果你的DropDown是HTML下拉，那麼這段代碼將W掃。

$("#DropDownName")[0].selectedIndex=0; 

Answer 5

我想這可能幫助：

$.getJSON('<%= Url.Action("GetDepartment") %>', 
       { coDepartment: paramDepartment }, 
       function(data) { 
        $(".autoCompleteDepartment").empty(); 
        $(".autoCompleteDepartment").append($("<option />").val(-1)); 
        $.each(data, function() { 
         $(".autoCompleteDepartment").append($("<option />").val(this.CodDepartment).text(this.DepartmentName)); 
        }); 
        $(".autoCompleteDepartment").val(-1);          
       } 
      ); 

如果你這樣做的方式，你有沒有文字添加元素。所以，當你點擊de combo時，它不會變成apear，但是你添加了一個值-1，以後用$（「。autoCompleteDepartment」）選擇。val（-1）;讓你控制組合是否有有效值。

希望它可以幫助任何人。

對不起，我的英語。

Answer 6

在當您加載所有<options ....></options>通過Ajax調用
按照以下步驟做這種情況。

1）。創建用於下拉
的設定值的單獨的方法對於例如：

function set_ip_base_country(countryCode) 
    $('#country').val(countryCode) 
} 

2）。調用此方法時，Ajax調用成功，所有的HTML追加任務完成

對於防爆：

success: function (doc) { 
    ..... 
    ..... 
    $("#country").append('<option style="color:black;" value="' + key + '">' + value + '</option>') 
    set_ip_base_country(ip_base_country) 
} 

Answer 7

這裏是一個由快速設置所選選項的功能：

function SetSelected(elem, val){ 
     $('#'+elem+' option').each(function(i,d){ 
     // console.log('searching match for '+ elem + ' ' + d.value + ' equal to '+ val); 
      if($.trim(d.value).toLowerCase() == $.trim(val).toLowerCase()){ 
     //  console.log('found match for '+ elem + ' ' + d.value); 
       $('#'+elem).prop('selectedIndex', i); 
      } 
     }); 
    } 

調用此函數與參數元素ID和選定的值;像這樣：

SetSelected('selectID','some option'); 

當需要設置很多選擇選項時它很有用。

Answer 8

正如@Nick貝拉爾迪建議，如果你改變了價值未在UI前端反映，嘗試：

$("#mydropdownlist").val("thevalue").change(); 

Answer 9

嘗試：

jQuery("#availability option:selected").val(); 

或獲得文本（）：

jQuery("#availability option:selected").text(); 

更多信息：

http://api.jquery.com/val/ 
http://api.jquery.com/text/ 

$(document).ready(function(){ 
 
    $('#button1').click(function(){ 
 
    alert($('#combo :selected').text()); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="combo"> 
 
    <option value="1">Test 1</option> 
 
    <option value="2">Test 2</option> 
 
</select> 
 
<input id="button1" type="button" value="Click!" />

Answer 10

有很多方法可以做到這一點。這裏是其中一些：

$("._statusDDL").val('2'); 

OR

$('select').prop('selectedIndex', 3); 

在這篇文章中也有不同的方式來Select drop down value using Jquery。

Answer 11

設置drop-downselected值和更新改變

$("#PR2DistrictId option[value='@Model.PR2DistrictId']").attr("selected", true).trigger("chosen:updated") 

在這裏，我們首先從Model設定值，比更新它選擇

Answer 12

下拉列表的// HTML格式。

<select id="MyDropDownList"> 
<option value=test1 selected>test1</option> 
<option value=test2>test2</option> 
<option value=test3>test3</option> 
<option value=test4>test4</option> 

//如果要更改所選擇的項目用javascript TEST2。試試這個。 //設置ü要選擇

var NewOprionValue = "Test2" 

     var RemoveSelected = $("#MyDropDownList")[0].innerHTML.replace('selected', ''); 
     var ChangeSelected = RemoveSelected.replace(NewOption, NewOption + 'selected>'); 
     $('#MyDropDownList').html(ChangeSelected); 

Answer 13

最佳答案的提問下一個選項：

$("#comboboxid").val(yourvalue).trigger("chosen:updated"); 

即G：

$("#CityID").val(20).trigger("chosen:updated"); 

或

$("#CityID").val("chicago").trigger("chosen:updated");