參考一下我在csdn這收集的代碼,是一個星級大俠的代碼,
希望對你有幫助。
問題:
用什么樣的方法可以在運行時向listbox中添加item?
解決:
動態(tài)增加與刪除SELECT的Option
<script>
// 添加選項
function addOption(pos){
var objSelect = document.myForm.mySelect;
// 取得字段值
var strName = document.myForm.myOptionName.value;
var strValue = document.myForm.myOptionValue.value;
// 建立Option對象
var objOption = new Option(strName,strValue);
if (pos == -1 & pos > objSelect.options.length)
objSelect.options[objSelect.options.length] = objOption;
else
objSelect.add(objOption, pos);
}
// 刪除選項
function deleteOption(type){
var objSelect = document.myForm.mySelect;
if(objSelect.options.length> 0){
if (type == true)
objSelect.options[objSelect.selectedIndex] = null;
else
objSelect.remove(objSelect.selectedIndex);
}
else
alert( "已經(jīng)沒有選項可以刪除了! ")
}
// 顯示選項信息
function showOption(objForm){
var objSelect = objForm.mySelect;
if(objSelect.options.length> 0){
document.all.myOptionName.value = objSelect.options[objSelect.selectedIndex].text;
document.all.myOptionValue.value = objSelect.options[objSelect.selectedIndex].value;
}
else
alert( "沒有選項可以顯示! ")
}
</script>
<form name= "myForm ">
<select name= "mySelect ">
<option value= "value1 " Selected> HTML </option>
<option value= "value2 "> JavaScript </option>
<option value= "value3 "> VBScript </option>
</select>
<input type= "button " onclick= "showOption(this.form) " value= "顯示 ">
<input type= "button " onclick= "deleteOption(true) " value= "刪除 ">
<input type= "button " onclick= "deleteOption(false) " value= "Remove方法 "> <br> <br>
選項名稱 : <input type= "text " name= "myOptionName " value= "CSS "> <br>
選項的值 : <input type= "text " name= "myOptionValue " value= "value4 ">
<input type= "button " onclick= "addOption(-1) " value= "添加 ">
<input type= "button " onclick= "addOption(0) " value= "插入 ">
</form>
簡單點寫就是:
<select name= "mySelect ">
<option value= "value1 " Selected> HTML </option>
<option value= "value2 "> JavaScript </option>
<option value= "value3 "> VBScript </option>
</select>
<button onclick= "document.all.mySelect.add(new Option( 'CSS ', 'value4 ')) "> Add </button>
對于listbox則為:
var o=document.createElement( "OPTION ");
o.value=document.all.appId.options[j].value;
o.text=document.all.appId.options[j].text;
document.all.ListID.add(o);
ID為ListBox的ListID
//實現(xiàn)select的聯(lián)動,另外,此代碼也可以做更改,動態(tài)的載入select的option的值
<form name=form1>
<select name=province onchange= "cityName(this.value) ">
<option value= " "> 請選擇省名 </option>
</select>
<select name=city>
<option value= " "> 請選擇城名 </option>
</select>
</form>
<script language=javascript>
var provinceName = [ "浙江 ", "江蘇 ", "安徽 ", "江西 "];
var 浙江 = [ "杭州 ", "寧波 ", "溫州 ", "紹興 ", "金華 ", "湖州 "];
var 江蘇 = [ "南京 ", "蘇州 ", "無錫 ", "常州 ", "鎮(zhèn)江 ", "徐州 "];
var 安徽 = [ "合肥 ", "翕縣 ", "黃山 ", "祁門 ", "休寧 "];
var 江西 = [ "南昌 ", "九江 ", "贛州 ", "上饒 ", "新余 ", "景德鎮(zhèn) "];
var cityouterHTML = document.form1.city.outerHTML.substr(0, document.form1.city.outerHTML.length-9);
function province()
{
var e = document.form1.province;
var s = e.outerHTML.substr(0, e.outerHTML.length-9) + "\r\n ";
for (var i=0; i <provinceName.length; i++){
s += " <option value= ' "+ provinceName[i] + " '> "+ provinceName[i] + " </option> \r\n ";}
s += " </select> ";
e.outerHTML = s;
} province();
function cityName(val)
{
var e = document.form1.city;
var s = cityouterHTML;
if (val == " ") {s += " </select> "; e.outerHTML = s; return;}
var a = eval(val);
//此句很關(guān)鍵 解釋val的javascript代碼,并且在解釋完之后執(zhí)行,如果eval在執(zhí)行的時候有返回值,
//則a即[result]是必選項.
for (var i=0; i <a.length; i++)
{
s += " <option value= ' "+ a[i] + " '> "+ a[i] + " </option> \r\n ";
}
s += " </select> ";
e.outerHTML = s;
}
</script>
本站僅提供存儲服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請
點擊舉報。