左右两个下拉列表框的选项互移及获值效果
效果截图:
源代码:
<script language="JavaScript">
<!--
/*move(s1,s2,flag):s1是源列表框,s2是目的列表框,flag是是否全部移动*/
function move(s1,s2,flag){
var tem=new Array();
var sa=document.frm.elements[s1];
var sb=document.frm.elements[s2];
var s=sa.selectedIndex>-1?1:0
with(sa)
for(i=length-1;i>=0;i--)
if(options[i].selected||flag){tem[tem.length]=options[i];options[i]=null}
if(s||flag){
for(i=0;i<sb.length;i++)tem[tem.length]=sb.options[i]
with(sb){
length=0;
tem.sort(sortArr)
for(i=0;i<tem.length;i++)options[length]=new Option(tem[i].text,tem[i].value)
}
}
}
/*显示列表框选中的值,s是列表框的name*/
function show(s){
var str=""
with(document.frm.elements[s])
for(i=0;i<length;i++)
if(options[i].selected)str+="\n第"+(i+1)+"个option:\ntext:"+options[i].text+" value:"+options[i].value
alert(str)
}
function sortArr(a,b){
if(a.text>b.text)return 1
if(a.text<b.text)return -1
return 0
}
//-->
</script>
<form name="frm">
<select name="a" size="5" style="width:100" multiple>
<option value="a1">1</option>
<option value="a2">2</option>
<option value="a3">3</option>
<option value="a4">4</option>
</select>
<input type=button value=">>" οnclick="move('a','b',1)">
<input type=button value=" > " οnclick="move('a','b')">
<input type=button value=" < " οnclick="move('b','a')">
<input type=button value="<<" οnclick="move('b','a',1)">
<select name="b" size="5" style="width:100" multiple>
<option value="b1">a</option>
<option value="b2">b</option>
<option value="b3">c</option>
<option value="b4">d</option>
<option value="b5">e</option>
</select><br/>
<input type=button value="get a's value" οnclick="show('a')">
<input type=button value="get b's value" οnclick="show('b')">
</form>
转载于:https://www.cnblogs.com/missthe/archive/2008/06/03/1212906.html
左右两个下拉列表框的选项互移及获值效果相关推荐
- XamarinEssentials教程移除键值首选项的键值
XamarinEssentials教程移除键值首选项的键值 如果开发者不再使用首选项中的某一项时,可以将该项移除掉.此时可以使用Preferences类的Remove()方法,该方法可以将存在于首选项 ...
- 两台电脑怎么文件互传,电脑和电脑互传文件怎么传,两台电脑怎么互传文件
两台电脑怎么文件互传?我们想要从一台电脑传文件到另一台电脑是一件非常麻烦的事情.大部分人都会想到用U盘来拷贝,先把文件复制到U盘中,再将U盘插入另一台电脑,然后粘贴出来.这种方法对于小文件来说比较方便 ...
- 服务器如何与手机互传文件,两个云服务器怎么互传文件
两个云服务器怎么互传文件 内容精选 换一换 本文介绍了云监控CES各特性版本的功能发布和对应的文档动态,新特性将在各个区域(Region)陆续发布,欢迎体验. 假如您有两个Web应用,需要部署在两个弹 ...
- 两个洞一个梁的移门衣柜
两个洞一个梁的移门衣柜 2015-07-03 09:01 家居设计 标签:设计 CAD 1466 发表评论 昨天我量了一个客户,他家的房子因为改造的原因,有一处地方变成了两个洞一个 ...
- 任选两个自然数,它们互质的概率是多少?
任选两个自然数,它们互质的概率是多少? 它就是s=2s = 2s=2时欧拉乘积公式右边的连乘的倒数,因此它等于s=2s = 2s=2时欧拉乘积公式左边的连加的倒数,即1/ζ(2)1/ζ(2)1/ζ(2 ...
- win7计算机之间传输文件,让两台win7电脑实现互传文件的方法
有时候需要两台win7电脑之间相互传送文件,有什么办法可以实用文件互传呢?方法当然是有的,网上也有很多相关的教程,但是操作起来比较麻烦.所以在这里小编教大家让两台win7电脑实现互传文件的简单方法,感 ...
- PHP遇到json解决的两个办法,转为数组,直接取值
为什么80%的码农都做不了架构师?>>> PHP遇到json解决的两个办法,转为数组,直接取值 //转为Array数据 $json = '{"a":1,&q ...
- layui的几个简单使用(简单弹窗,加载效果,移除加载效果)
1.加载效果和移除加载效果 function layuiLoading(msg){layui.use(['layer', 'form'], function(){index = layer.load( ...
- mysql获取两个表中日期字段的最小差值
一.前言 开发中碰到的需求,获取两个数据表中日期字段的差值,并且取得差值最小的那条数据.本篇文章主要讲述如果通过函数获取mysql的日期差值,实际编写时遇到的问题,并且分析需求,得出最终sql等. 二 ...
最新文章
- windows server 2003磁盘管理
- 索引初识一 MySql
- TIOBE 8 月榜单:Groovy 和 Objective-C 重返前二十
- WSGI 是什么?和nginx有什么关系?
- Spring Cloud 2020.0.0 正式发布,对开发者来说意味着什么?
- 【Python教程】 正则表达式 re模块中,反斜杠 “\“分割字符串的正确操作方法
- 高性能服务器架构思路【不仅是思路】
- For循环(十分重要)
- 这样设置路由,99.9%的黑客都攻不破
- numpy-np.isin
- Atitit保证架构超前性 前瞻性 目录 第一章 为什么需要修改代码	1 第一节 业务增加功能	1 第二节 增加字段	1 第三节 增加表数据需要查询 修改	1 第四节 类库升级	1 第二章 简单抽象
- 小众绿软|游戏:Lode Runner 2(3D挖金子,英文版)(LodeRunner2)
- mysql数据库左连接
- 移植emwin到stm32f205上卡死在gui_init();
- Kaldi中文语音识别:各种开源的已经训练好的语音识别模型
- 激光SLAM:激光雷达运动畸变补偿--轮速里程计辅助方法
- Python:同花顺全数据接口
- JavaScript弹性透明的图片放大代码
- 基于JavaEE的游泳馆管理系统_JSP网站设计_SQLServer数据库设计
- @Component和@ComponentScan