将select中的项从一个移动到另一个select中
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>将select中的项互相移动(添加或移除)</title>
<script language="javascript" type="text/javascript">
function execSelectGroup(tagContentID, flag)
{
var obj = document.getElementById(tagContentID).getElementsByTagName("select");
var i, j, moveFrom, moveTo;
if(flag == 1 || flag == 2) //全部添加或添加
{
moveFrom = obj[0]; //availableGroups
moveTo = obj[1]; //selectedGroups
}
else if(flag == 3 || flag == 4) //删除或全部删除
{
moveFrom = obj[1];
moveTo = obj[0];
}
for(i = 0; i < moveFrom.length;)
{
var op = moveFrom.options[i];
if(flag == 1 || flag == 4 || moveFrom.options[i].selected) //全部添加或移除
{
var newOption = document.createElement("option");
newOption.value = op.value;
newOption.text = op.text;
moveTo.options.add(newOption); //增加一个
moveFrom.remove(i);
}
else
i++;
}
}
</script>
</head>
<body>
<div id="addAccount_tagContent3" class="tagContent">
<table width="600" border="0" cellspacing="0" cellpadding="5">
<tr>
<td>
<fieldset>
<legend>组信息</legend>
<table width="100%" border="0" cellspacing="0" cellpadding="2" align="center">
<tr>
<td style="width:40%;text-align:center;">
可选组
</td>
<td>
</td>
<td style="width:40%;text-align:center;">
已选组
</td>
</tr>
<tr>
<td style="width:40%;text-align:center;">
<select name="availableGroups" size="10" style="width:120px;" multiple>
<option value="1">可选组一</option>
<option value="2">可选组二</option>
<option value="3">可选组三</option>
</select>
</td>
<td align="center">
<input type="button" name="selectAll" value=">>" style="width:35px; height:18px; margin-bottom:2px;" title="全部添加" οnclick="execSelectGroup('addAccount_tagContent3', 1)" /><br/>
<input type="button" name="addThis" value=">" style="width:35px; height:18px; margin-bottom:2px;" title="添加" οnclick="execSelectGroup('addAccount_tagContent3', 2)" /><br/>
<input type="button" name="deleteThis" value="<" style="width:35px; height:18px; margin-bottom:2px;" title="删除" οnclick="execSelectGroup('addAccount_tagContent3', 3)" /><br/>
<input type="button" name="deleteAll" value="<<" style="width:35px; height:18px; margin-bottom:2px;" title="全部删除" οnclick="execSelectGroup('addAccount_tagContent3', 4)" /><br/>
</td>
<td style="width:40%;text-align:center;">
<select name="selectedGroups" size="10" style="width:120px;" multiple>
<option value="1">已选组一</option>
<option value="2">已选组二</option>
<option value="3">已选组三</option>
<option value="4">已选组四</option>
</select>
</td>
</tr>
</table>
</fieldset>
</td>
</tr>
</table>
</div>
<div id="editAccount_tagContent3" class="tagContent">
<table width="600" border="0" cellspacing="0" cellpadding="5">
<tr>
<td>
<fieldset>
<legend>组信息</legend>
<table width="100%" border="0" cellspacing="0" cellpadding="2" align="center">
<tr>
<td style="width:40%;text-align:center;">
可选组
</td>
<td>
</td>
<td style="width:40%;text-align:center;">
已选组
</td>
</tr>
<tr>
<td style="width:40%;text-align:center;">
<select name="availableGroups" size="10" style="width:120px;" multiple>
<option value="1">可选组一</option>
<option value="2">可选组二</option>
<option value="3">可选组三</option>
<option value="4">可选组四</option>
<option value="5">可选组五</option>
</select>
</td>
<td align="center">
<input type="button" name="selectAll" value=">>" style="width:35px; height:18px; margin-bottom:2px;" title="全部添加" οnclick="execSelectGroup('editAccount_tagContent3', 1)" /><br>
<input type="button" name="addThis" value=">" style="width:35px; height:18px; margin-bottom:2px;" title="添加" οnclick="execSelectGroup('editAccount_tagContent3', 2)" /><br>
<input type="button" name="deleteThis" value="<" style="width:35px; height:18px; margin-bottom:2px;" title="删除" οnclick="execSelectGroup('editAccount_tagContent3', 3)" /><br>
<input type="button" name="deleteAll" value="<<" style="width:35px; height:18px; margin-bottom:2px;" title="全部删除" οnclick="execSelectGroup('editAccount_tagContent3', 4)" /><br>
</td>
<td style="width:40%;text-align:center;">
<select name="selectedGroups" size="10" style="width:120px;" multiple>
<option value="1">已选组一</option>
<option value="2">已选组二</option>
</select>
</td>
</tr>
</table>
</fieldset>
</td>
</tr>
</table>
</div>
</body>
</html>
将select中的项从一个移动到另一个select中相关推荐
- js将数组中相同项放在一个数组
js将数组中相同项放在一个数组 原本数组长这样:图一 想将数组中相同项放在一个数组 得到:图二 转换中也可以得到:图三 方法: sortArr(arr, str) {var _arr = [],_t ...
- java接口中只能定义常量和抽象方法_java基础19. 下列有关接口的叙述错误的是哪项？() A．接口中只能包含抽象方法和常量 B．一个类可以实现多个接口...
共回答了21个问题采纳率:81% 选择错误的. A 接口中只能包含抽象方法和常量 这个是正确的 下面给你说一下抽象类和接口的区别:抽象类由abstract关键字来修饰,接口由interface关键字来 ...
- c/c++实现一个密集型server/socket多路复用select
作一个tcp的服务程序,同时可能有大量的客户端连上来,希望分别记住各个socket 谁有数据过来,就读出来,放到一个请求队列--这些事情用一个线程完成 另外有一个结果队列,如果结果里包含了socket ...
- html select选择事件_一道搜狗面试题：IO多路复用中select、poll、epoll之间的区别...
(1)select==>时间复杂度O(n) 它仅仅知道了,有I/O事件发生了,却并不知道是哪那几个流(可能有一个,多个,甚至全部),我们只能无差别轮询所有流,找出能读出数据,或者写入数据的流,对 ...
- jquery操作select下拉框的各种方法，获取选中项的值或文本，根据指定的值或文本选中select的option项等...
简介jquery里对select进行各种操作的方法,如联动.取值.根据值或文本来选中指定的select下拉框指定的option选项,读取select选中项的值和文本等. 这一章,站长总结一下jquer ...
- 面试中常被问到的（20）select，poll，epoll对比
从以下四个角度进行对比: 用户态将文件描述符传入内核的方式 (1)select:创建三个文件描述符集并拷贝到内核中,分别监听 读,写,异常动作 (2)poll:将传入struct pollfd结构体数 ...
- android 去重 比较两个list_android 去重 比较两个list_Android 去除list集合中重复项的几种方法...
因为用到list,要去除重复数据,尝试了几种方法.记录于此... 测试数据: List li1 = new List { "", "", "" ...
- android 去重 比较两个list_Android 去除list集合中重复项的几种方法
因为用到list,要去除重复数据,尝试了几种方法.记录于此... 测试数据: List li1 = new List { "", "", "" ...
- insert 语句的选择列表包含的项多于插入列表中的项_如何定义和使用Python列表（Lists）
Python中最简单的数据集合是一个列表(list).列表是方括号内用逗号分隔的任何数据项列表.通常,就像使用变量一样,使用=符号为Python列表分配名称. 如果列表中包含数字,则不要在其周围使用引 ...
最新文章
- MPB：军科院杨瑞馥、毕玉晶等-培养组学方法优化(视频)
- 【转载】register、volatile、restrict 三关键字的用法
- python绘图实例-Python使用matplotlib简单绘图示例
- 阿里云计算平台招AI解决方案产品经理
- Debug ASP.NET Core 2.0源代码
- CVPR2021 视频超分辨率中的时空蒸馏方案
- 11g表名大小写 oracle_Oracle数据库总结
- 银河麒麟支持php吗,银河麒麟Linux
- 没有microsoft store(微软商店)或下载过慢解决方法
- 思维导图制作工具BLUMIND 小巧免激活 免安装 仅2M
- 谷歌地图、百度地图、搜搜地图之浅比较
- c语言getch常见错误,getch（）出错
- 公司有打算使用神州数码的EasyFlow工作流管理系统
- 输入192.168.1.1登陆页面打不开怎么办
- maven、md5、git学习
- laravel 使用SSH 隧道连接到远程数据库
- 『Backup』不用JTAG修好你的Lumia死砖？绝对行！
- 吉首大学校赛B——干物妹小埋（线段树求最大递增子序列）
- 魔兽世界盒子怎么修改服务器地址,多玩魔盒怎么设置界面 多玩魔兽盒子多玩界面调整教程...
- 施耐德电气美国研发中心揭秘之旅
热门文章
- python 工具箱_Python交易工具箱：通过指标子图增强图表
- 数据可视化及其重要性：Python
- redis将散裂中某个值自增_这些Redis命令你都掌握了没？
- leetcode60. 第k个排列（回溯算法）
- leetcode29. 两数相除（位运算）
- sql注入语句示例大全_SQL Order By语句：示例语法
- 平面设计 前端_我如何在5个月内从平面设计师过渡到前端开发人员
- sap中泰国有预扣税设置吗_泰国餐厅密度细分：带有K-means聚类的python
- .Net Core 商城微服务项目系列（二）：使用Ocelot + Consul构建具备服务注册和发现功能的网关...
- Linux 等待进程结束 wait() 和 waitpid()