js模拟权限选择实现代码(select操作)

更新时间：2012年02月14日 18:34:58 作者：

权限选择页面，选择、撤回、全部选择、全部撤回

<html> <head> <title></title> <script type="text/javascript"> //移动所有项。 function moveAllOptions(selone, seltwo) { //获得selone中的每个option var opts = selone.getElementsByTagName('option'); //这种循环有问题，不能从0开始，因为opts就像集合一样， //每次将自己的元素加到别的元素下的时候这个元素就从自己子元素中自动删除。 // for (var i = 0; i < opts.length; i++) { // //将selone中的每个option都加到了seltwo中。 // seltwo.appendChild(opts[i]); // } for (var i = opts.length - 1; i >= 0; i--) { //将selone中的每个option都加到了seltwo中。 seltwo.appendChild(opts[i]); } } //移动选中项 function moveSelectedOptions(selone, seltwo) { //获取第一个元素中的所有的option var opts = selone.getElementsByTagName('option'); for (var i = opts.length - 1; i >= 0; i--) { if (opts[i].selected == true) { seltwo.appendChild(opts[i]); } } } </script> </head> <body> <select id="selNum1" multiple="multiple"> <option>添加</option> <option>修改</option> <option>删除</option> <option>保存</option> </select> <input type="button" name="name" value=">>" onclick="moveAllOptions(document.getElementById('selNum1'),document.getElementById('selNum2'));" /> <input type="button" name="name" value=">" onclick="moveSelectedOptions(document.getElementById('selNum1'),document.getElementById('selNum2'));" /> <input type="button" name="name" value="<" onclick="moveSelectedOptions(document.getElementById('selNum2'),document.getElementById('selNum1'));" /> <input type="button" name="name" value="<<" onclick="moveAllOptions(document.getElementById('selNum2'),document.getElementById('selNum1'));" /> <select id="selNum2" multiple="multiple"> </select> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

权限选择

仿51JOB的地区选择效果(可选择多个地区)
以下是HTML网页特效代码，点击运行按钮可查看效果
2008-11-11
表单填写时用回车代替TAB的实现方法
表单填写时用回车代替TAB的实现方法...
2007-10-10
比较简单的javascript实现input双击后可以编辑
比较简单的javascript实现input双击后可以编辑...
2007-08-08
JS实多级联动下拉菜单类，简单实现省市区联动菜单！
JS实多级联动下拉菜单类，简单实现省市区联动菜单！...
2007-05-05
css+js实现select列表横向排列效果代码
真不错的select横排效果代码，推荐大家阅读，这个思路真不错，太感谢作者了
2008-06-06
js下在password表单内显示提示信息的解决办法
js下在password表单内显示提示信息的解决办法...
2007-08-08
CSS3实现动态背景登录框的代码
本文介绍了一款基于jQuery+CSS3实现的带有动画效果的动态背景登陆框特效，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2015-07-07
javascript 全选/反选,取消选择效果
刚才博客园的javascript首页看到一个朋友的全选/反选效果。
2010-04-04
用户注册常用javascript代码
用户注册常用javascript代码,大家可以保存运行看下效果。
2009-08-08
输入数量和价格自动计算输出金额的js代码
通过输入数量和价格自动计算输出金额的代码，主要用于购物网站，需要的朋友可以参考下
2013-03-03