select多选的时候可以一次移动多个，现在每次只能一个
当在左侧选择多个后，点击添加，一次只能过去一个。
如何修改成一次把选择后的都添加过去？
谢谢了！
代码如下：
- HTML code
<html xmlns="http://www.w3.org/1999/xhtml"><head><title></title><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><script language="javascript">var base;function SelectOne() { if (form1.beixuan.options.length == 0 || form1.beixuan.selectedIndex < 0) { return false; } base = 0; for (var j = 0; j < form1.yixuan.options.length; j++) { if (form1.beixuan.options[form1.beixuan.selectedIndex].value == form1.yixuan.options[j].value) { base = 1; break; } } if (base == 0) { var e = document.createElement("OPTION"); e.value = form1.beixuan.options[form1.beixuan.selectedIndex].value; e.text = form1.beixuan.options[form1.beixuan.selectedIndex].text; form1.yixuan.options.add(e); } form1.beixuan.options.remove(form1.beixuan.selectedIndex);}function BackOne() { if (form1.yixuan.options.length == 0 || form1.yixuan.selectedIndex < 0) { return false; } base = 0; for (var j = 0; j < form1.beixuan.options.length; j++) { if (form1.yixuan.options[form1.yixuan.selectedIndex].value == form1.beixuan.options[j].value) { base = 1; break; } } if (base == 0) { var e = document.createElement("OPTION"); e.value = form1.yixuan.options[form1.yixuan.selectedIndex].value; e.text = form1.yixuan.options[form1.yixuan.selectedIndex].text; form1.beixuan.options.add(e); } form1.yixuan.options.remove(form1.yixuan.selectedIndex);}</script></head><body><form method='post' name='form1' id='form1' onSubmit="return false"> <table width='100%' cellspacing='1'> <tr> <td colspan=2 class="p10"><table width='100%' cellspacing='1'> <tr align='center'> <td><select multiple id='beixuan' name='beixuan' style="display:inline;width:100%;" size='9' rows='9' ondblclick="javascript:SelectOne();"> <option value=1>用户1 [商务部]</option> <option value=2>用户2 [商务部]</option> <option value=3>用户3 [管理部]</option> <option value=4>用户4 [公安部]</option> <option value=5>用户5 [公安部]</option> <option value=6>用户6 [外交部]</option> <option value=7>用户7 [外交部]</option> </select></td> <td valign='center' width='40'> <input type="button" value="添加" onClick="javascript:SelectOne();" name="B1"><br /><br /> <input type="button" value="移除" onClick="javascript:BackOne();" name="B2"> </td> <td class=row><select multiple id='yixuan' name='yixuan' style="display:inline;width:100%;" size=9 rows=9 ondblclick="javascript:BackOne();"> </select></td> </tr> </table></td> </tr> </table></form></body></html>[解决办法]
JS代码：
function SelectItems()
{
var selectItems=document.getElementById("beixuan").options;
var tranItems=document.getElementById("yixuan").options;
for(var i=0; i < selectItems.length; i++)
{
if(selectItems[i].selected)
{
//alert(selectItems[i].value);
var oOption = document.createElement("OPTION");
tranItems.add(oOption);
oOption.innerText=selectItems[i].innerText;
oOption.value=selectItems[i].value;
oOption.selected=true;
selectItems.remove(i);
}
}
}
就可实现多选的效果
[解决办法]
- JScript code
<html xmlns="http://www.w3.org/1999/xhtml"><head><title></title><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><script language="javascript">var base;function SelectOne() { if (form1.beixuan.options.length == 0 || form1.beixuan.selectedIndex < 0) { return false; } var selectCollection = form1.beixuan.options; for (var j = 0; j < selectCollection.length; j++) { if (selectCollection[j].selected) { alert(j); var e = document.createElement("OPTION"); e.value = selectCollection[j].value; e.text = selectCollection[j].text; form1.yixuan.options.add(e); } } for (var j = 0; j < selectCollection.length; j++) { if (selectCollection[j].selected) { form1.beixuan.options.remove(selectCollection[j]); } } }function BackOne() { if (form1.yixuan.options.length == 0 || form1.yixuan.selectedIndex < 0) { return false; } var selectCollection = form1.yixuan.options; for (var j = 0; j < selectCollection.length; j++) { if (selectCollection[j].selected) { alert(j); var e = document.createElement("OPTION"); e.value = selectCollection[j].value; e.text = selectCollection[j].text; form1.beixuan.options.add(e); } } for (var j = 0; j < selectCollection.length; j++) { if (selectCollection[j].selected) { form1.yixuan.options.remove(selectCollection[j]); } }}</script></head><body><form method='post' name='form1' id='form1' onSubmit="return false"> <table width='100%' cellspacing='1'> <tr> <td colspan=2 class="p10"><table width='100%' cellspacing='1'> <tr align='center'> <td><select multiple id='beixuan' name='beixuan' style="display:inline;width:100%;" size='9' rows='9' ondblclick="javascript:SelectOne();"> <option value=1>用户1 [商务部]</option> <option value=2>用户2 [商务部]</option> <option value=3>用户3 [管理部]</option> <option value=4>用户4 [公安部]</option> <option value=5>用户5 [公安部]</option> <option value=6>用户6 [外交部]</option> <option value=7>用户7 [外交部]</option> </select></td> <td valign='center' width='40'> <input type="button" value="添加" onClick="javascript:SelectOne();" name="B1"><br /><br /> <input type="button" value="移除" onClick="javascript:BackOne();" name="B2"> </td> <td class=row><select multiple id='yixuan' name='yixuan' style="display:inline;width:100%;" size=9 rows=9 ondblclick="javascript:BackOne();"> </select></td> </tr> </table></td> </tr> </table></form></body></html>