1.js可以動態產生select控件:
語句如下: var se=document.createElement("select");
se.id="se_test";
se.options.add(new Option("text","value"));
document.body.appendChild(se);
2.select控件的添加和刪除操作完整的html代碼,給大家分享一下
<html>
<head>
<title>測試操作select</title>
<mce:script type="text/javascript"><!--
/*
*數據初始化
*/
function loadData(){
//定義常量數組
var array=new Array();
array[0]="星期一";
array[1]="星期二";
array[2]="星期三";
array[3]="星期四";
array[4]="星期五";
//獲取select控件
var obj=document.getElementById("se_test");
obj.options.length=0;
//控件初始化操作,動態添加option
for(var i=0;i<array.length;i++){
addOp(obj,array[i],array[i]);
}
}
function addOp(obj,key,value){
var op=new Option(key,value);
obj.options.add(op);
}
function addOption(){
var obj=document.getElementById("se_test");
var key=document.getElementById("tx_name").value;
var value=document.getElementById("tx_value").value;
addOp(obj,key,value);
}
function delOp(){
var obj=document.getElementById("se_test");
obj.options.remove(obj.selectedindex);
obj.options.selectedIndex=0;
}
function truncateOp(){
var obj=document.getElementById("se_test");
obj.options.length=0;
}
function alertSelectItem(){
var obj=document.getElementById("se_test");
var ops=obj.options[obj.selectedIndex];
alert("text="+ops.text+":"+"value="+ops.value);
}
// --></mce:script>
</head>
<body οnlοad="loadData()">
<table>
<tr>
<td ><label>測試select操作</label></td>
<td>
<select id="se_test" name="se_test">
</select>
</td>
</tr>
</table>
<table>
<tr>
<td><label>名稱</label></td>
<td><input type="text" id="tx_name"></td>
<td><label>值</label></td>
<td><input type="text" id="tx_value"></td>
</tr>
</table>
<input type="button" οnclick="addOption()" value="添加">
<input type="button" οnclick="delOp()" value="刪除">
<input type="button" οnclick="loadData()" value="初始化">
<input type="button" οnclick="truncateOp()" value="清空">
<input type="button" οnclick="alertSelectItem()" value="顯示選中內容">
</body>
</html>