js 動態設置 option 的selected 選項

思路：通過for循環判斷每個選項，一旦滿足條件則設置其selected屬性為true即可，關鍵代碼：

var obj = document.getElementById(select_id);
for(i=0;i<obj.length;i++){
  if(obj[i].value == something)
    obj[i].selected = true;
}

下面給出實例演示：

1、HTML結構

<select id="test">
    <option selected value="0">- 請選擇 -</option>
    <option value="1">關羽</option>
    <option value="2">趙雲</option>
    <option value="3">馬超</option>
    <option value="4">黃忠</option>
    <option value="5">張飛</option>
</select>
<input type="text" id="sel_text"/><input type='button' value='設置選項' onclick="fun()"/>

2、javascript代碼

function fun(){
    var str = document.getElementById("sel_text").value;
    var obj = document.getElementById("test");
    for(i=0;i<obj.length;i++){
        if(obj[i].value==str)
            obj[i].selected = true;
    }
}

 

3、設置效果：如圖設置選中項為2，點擊按鈕后"趙雲"即被選中