Select下拉列表框(添加、删除option)
2010-7-12编辑:feimeimei
这是一个实现Select下拉列表框(添加、删除option) 的实例代码,新手朋友可以学习一下,
<select id="s1" size="5" multiple="multiple">
<option value="11111">11111</option>
<option value="22222">22222</option>
<option value="33333">33333</option>
<option value="44444">44444</option>
<option value="55555">55555</option>
</select>
<select id="s2" size="5" multiple="multiple">
</select>
<br /><br />
<input type="button" value="添加" onclick="AddOrRomove(’add’);" />
<input type="button" value="删除" onclick="AddOrRomove(’remove’);" />
<script language="javascript" type="text/javascript">
function AddOrRomove(action)
{
var s1 = document.getElementById("s1");
var s2 = document.getElementById("s2");
var optionArray = new Array();
if (action == "add") //添加
{
for (var i=0;i<s1.options.length;i++)
{
if (s1.options[i].selected == true)
{optionArray.push(s1.options[i]);}
}
for (var j in optionArray)
{
optionArray[j].selected = false;
s2.options.appendChild(optionArray[j]);
}
}
else if (action == "remove") //删除
{
for (var i=0;i<s2.options.length;i++)
{
if (s2.options[i].selected == true)
{optionArray.push(s2.options[i]);}
}
for (var j in optionArray)
{
optionArray[j].selected = false;
s1.options.appendChild(optionArray[j]);
}
}
}
</script>