js模拟权限选择实现代码(select操作)_表单特效

来源：懂视网责编：小采时间：2020-11-27 21:02:30

js模拟权限选择实现代码(select操作)_表单特效

js模拟权限选择实现代码(select操作)_表单特效: //移动所有项。 function moveAllOptions(selone, seltwo) { //获得selone中的每个option var opts = selone.getElementsByTagName('option'); //这种循环有问题，不能从0开始，因为opts就像集合一样， //每次将自己的元素加到别的元素

推荐度：

点击下载本文 文档为doc格式

导读js模拟权限选择实现代码(select操作)_表单特效: //移动所有项。 function moveAllOptions(selone, seltwo) { //获得selone中的每个option var opts = selone.getElementsByTagName('option'); //这种循环有问题，不能从0开始，因为opts就像集合一样， //每次将自己的元素加到别的元素

<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需刷新才能执行]

js模拟权限选择实现代码(select操作)_表单特效

推荐度：

点击下载本文 文档为doc格式

标签：特效选择 js

热门焦点

js模拟权限选择实现代码(select操作)_表单特效

js模拟权限选择实现代码(select操作)_表单特效

js模拟权限选择实现代码(select操作)_表单特效

最新推荐

猜你喜欢

热门推荐