参考一下我在csdn这收集的代码,是一个星级大侠的代码,
希望对你有帮助。
问题:
用什么样的方法可以在运行时向listbox中添加item?
解决:
动态增加与删除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( "已经没有选项可以删除了! ")
}
// 显示选项信息
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
//实现select的联动,另外,此代码也可以做更改,动态的载入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 江苏 = [ "南京 ", "苏州 ", "无锡 ", "常州 ", "镇江 ", "徐州 "];
var 安徽 = [ "合肥 ", "翕县 ", "黄山 ", "祁门 ", "休宁 "];
var 江西 = [ "南昌 ", "九江 ", "赣州 ", "上饶 ", "新余 ", "景德镇 "];
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);
//此句很关键 解释val的javascript代码,并且在解释完之后执行,如果eval在执行的时候有返回值,
//则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>
本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请
点击举报。