六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 115|回复: 0

列表框的左右上下移动

[复制链接]

升级  41.33%

32

主题

32

主题

32

主题

秀才

Rank: 2

积分
112
 楼主| 发表于 2013-2-7 19:34:46 | 显示全部楼层 |阅读模式
效果:

HTML页面代码:
<!doctype html public "-//w3c//dtd html 4.0 transitional//en"><html><head><title>js操作列表框</title></head><script language="javascript"><!--var ListUtil = new Object();//全部移动ListUtil.moveAll = function moveAll(oListboxFrom,oListboxTo){var options = oListboxFrom.options;for(var i = 0; i < options.length; i++){oListboxTo.appendChild(options); //???i -= 1;  //???每删除一个选项后,每个选项的index会被重置}}//单个或多个移动ListUtil.moveMuti = function moveMuti(oListboxFrom,oListboxTo){var options = oListboxFrom.options;for(var i = 0; i < options.length; i++){if(options.selected){oListboxTo.appendChild(options);i -= 1;}}}//上移ListUtil.shiftUp = function(oListbox) {if(oListbox.selectedIndex > 0){var oOption = oListbox.options[oListbox.selectedIndex];var oPrevOption = oListbox.options[oListbox.selectedIndex-1];oListbox.insertBefore(oOption,oPrevOption);}}//下移ListUtil.shiftDown = function(oListbox){if(oListbox.selectedIndex < oListbox.options.length-1){var oOption = oListbox.options[oListbox.selectedIndex];var oNextOption = oListbox.options[oListbox.selectedIndex+1];oListbox.insertBefore(oNextOption,oOption);}}//--></script><body text="#000000" bgcolor="#ffffff" link="#0033cc"><form method=post action="#"><table><tr><td>未选员工<select name="oListboxFrom" id="oListboxFrom" size="10" multiple="true"style="width:100px;height:250px;margin-left:20px;float:left"><option value="1" selected>员工1</option><option value="2">员工2</option><option value="3">员工3</option><option value="4">员工4</option><option value="5">员工5</option></select></td><td align="center"><input type="button" value=" >>> " /><br/><input type="button" value=" >> " /><br/><input type="button" value=" << "  /><br/><input type="button" value=" <<< "  /><br/><input type="button" value=" ↑ " /><br/><input type="button" value=" ↓ " /></td><td>已选员工<select name="oListboxTo" id="oListboxTo" multiple="true" size="10"style="width:100px;height:250px;margin-left:20px;float:left"><option value="319094784">员工6</option><option value="320274432">员工8</option><option value="322109440">员工7</option></select></td></tr></table></form></body></html>
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表