方法有兩種。
第一種通過<select>的屬性來設(shè)置選中項，此方法可以在動態(tài)語言如php在后臺根據(jù)需要控制輸出結(jié)果。
1
2
3
4
5
<select id= "sel">
<option value="1">1</option>
<option value="2" selected="selected">2</option>
<option value="3">3</option>
</select>
第二種為通過前端js來控制選中的項: 由 www.169it.com 搜集整理
1
2
3
4
5
6
7
8
9
10
11
<script type="text/javascript">
function change(){
document.getElementById("sel")[2].selected=true;
}
</script>
<select id= "sel">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<input type="button" value="修改" onclick="change()" />
獲取<select>標(biāo)簽選中項文本的js代碼為:
1
2
var val = document.all.Item.options[document.all.Item.selectedIndex].text
var i=document.getElementById('sel').options[document.getElementById('sel').selectedIndex].value;
一些其它操作<select>標(biāo)簽的技巧如下：
1)動態(tài)創(chuàng)建select
1
2
3
4
5
function createSelect(){
var mySelect = document.createElement("select");
mySelect.id = "mySelect";
document.body.appendChild(mySelect);
}
2)添加選項option
1
2
3
4
5
6
function addOption(){
//根據(jù)id查找對象，
var obj=document.getElementById('mySelect');
//添加一個選項
obj.add(new Option("文本","值"));
}
3)刪除所有選項option
1
2
3
4
function removeAll(){
var obj=document.getElementById('mySelect');
obj.options.length=0;
}
4)刪除一個選項option
1
2
3
4
5
6
function removeOne(){
var obj=document.getElementById('mySelect');
//index,要刪除選項的序號，這里取當(dāng)前選中選項的序號
var index=obj.selectedIndex;
obj.options.remove(index);
}
5)獲得選項option的值
1
2
3
var obj=document.getElementById('mySelect');
var index=obj.selectedIndex; //序號，取當(dāng)前選中選項的序號
var val = obj.options[index].value;
6)獲得選項option的文本
1
2
3
var obj=document.getElementById('mySelect');
var index=obj.selectedIndex; //序號，取當(dāng)前選中選項的序號
var val = obj.options[index].text;
7)修改選項option
1
2
3
var obj=document.getElementById('mySelect');
var index=obj.selectedIndex; //序號，取當(dāng)前選中選項的序號
var val = obj.options[index]=new Option("新文本","新值");
8)刪除select
1
2
3
4
function removeSelect(){
var mySelect = document.getElementById("mySelect");
mySelect.parentNode.removeChild(mySelect);
}
文章來源:
HTML中的<select>標(biāo)簽如何設(shè)置默認(rèn)選中的選項
