争怎路由网:是一个主要分享无线路由器安装设置经验的网站,汇总WiFi常见问题的解决方法。

俺的小作品:根据下拉下文动态在下文框中显示,并完成2个下文框互斥选择

时间:2024/6/29作者:未知来源:争怎路由网人气:

具体功能用一下就知道了,在下拉框中选择一个,左边的列表框就显示相应的值,点那4个按钮能够实现左右2个列表框选项互相排斥,很好玩的。。估计大家开发的时候经常要用到,所以就帖上来了。

代码如下:
<style>
td,select,input{font-size:9pt}
</style>
<script>
var subcat = new Array();//下拉列表数组定义
subcat[0] = new Array("计划采购员B","2","cs101");
subcat[1] = new Array("仓库管理员B","2","cs111");
subcat[2] = new Array("仓库管理员","1","111");
subcat[3] = new Array("门市管理员","1","122");
subcat[4] = new Array("计划审批员","1","MASTER");
subcat[5] = new Array("计划审批员B","2","cs100");
subcat[6] = new Array("计划采购员","1","103");
subcat[7] = new Array("统计员","1","李尚英");
subcat[8] = new Array("统计员B","2","cs133");
// 这个数组可以根据实际需要用程序继续添加元素
var onecount=subcat.length;
var c=0;d=0;// 2个select的optoins的索引位置...

function moveto2(fn,s1,s2)// ">>" Button function
{
fs1=eval(fn+"."+s1);//formName1.SelectName1
fs2=eval(fn+"."+s2);
d=fs2.options.length;
for(i=0;i<fs1.options.length;i++)
{
var myOption = new

Option(fs1.options[i].innerText,fs1.options[i].value);

fs2.options[d]=myOption ;
fs2.options[d].selected=true;
fs1.options[i].selected=true;
d++;
}
k=0;
while(k<fs1.options.length)
{
fs1.remove(k);
c--;
}
}

function moveto1(fn,s1,s2)//"<<" Button
{
 fs1=eval(fn+"."+s1);
 fs2=eval(fn+"."+s2);
 c=fs1.options.length;
 for(i=0;i<fs2.options.length;i++)
{
var myOption = new

Option(fs2.options[i].innerText,fs2.options[i].value);

fs1.options[c]=myOption ;
fs1.options[c].selected=true;
fs2.options[i].selected=true;
c++;
}
 k=0;
 while(k<fs2.options.length)
{
fs2.remove(k);
d--;
}
}

function move1to2(fn,s1,s2)//">" Button
{
fs1=eval(fn+"."+s1);
fs2=eval(fn+"."+s2);
c=fs1.options.length;
d=fs2.options.length;
for(i=0;i<fs1.options.length;i++)
{
if(fs1.options[i].selected)
{
var myOption = new
Option(fs1.options[i].innerText,fs1.options[i].value);

fs2.options[d]=myOption ;
fs2.options[d].selected=true;
d++;
}
}
k=0;
while(k<fs1.options.length+3) // 这里为什么要+3,我也不知道
{
del(fn,s1,s2);
k++;
}
}

function del(fn,s1,s2) // 删除选择的列表项目
{
fs1=eval(fn+"."+s1);
fs2=eval(fn+"."+s2);
for(i=0;i<fs1.options.length;i++)
{
if(fs1.options[i].selected)
{
fs1.remove(i);
c--;
}
}
}

function move2to1(fn,s1,s2)// "<" Button

fs1=eval(fn+"."+s1);
fs2=eval(fn+"."+s2);
c=fs1.options.length;
for(i=0;i<fs2.options.length;i++)
{
if(fs2.options[i].selected)
{
var myOption = new
Option(fs2.options[i].innerText,fs2.options[i].value);

fs1.options[c]=myOption ;
fs1.options[c].selected=true;
c++;
}
}
k=0;
while(k<fs2.options.length+3)
{
del1(fn,s1,s2);
k++;
}
}

function del1(fn,s1,s2)
{
fs1=eval(fn+"."+s1);
fs2=eval(fn+"."+s2);
for(i=0;i<fs2.options.length;i++)
{
if(fs2.options[i].selected)
{
fs2.remove(i);
d--;
}
}
}

function changelocation(locationid)// 根据选择下拉框动态改变下面的列表内容,可要可不要
{
form1.src1.length = 0;
var locationid=locationid;
var i;
for (i=0;i < onecount; i++)
{
if (subcat[i][1] == locationid)
{
form1.src1.options[form1.src1.length] = new Option(subcat[i][0], subcat[i][0]);
}
}

}
</script>
<form method="POST" name=form1>
<div align="center">
<center>
<table border="1" cellspacing="0" width="80%" bordercolorlight="#808080" bordercolordark="#FFFFFF" bgcolor="#F7F7F7">
<tr>
<td width="100" align="right" valign="middle">接收人:</td>
<td width="195">
<selectsize="1" name="ms" onChange="changelocation(this.value)">
<option value="1">石油总公司物资</option>
<option value="2">市石油公司物业公司</option>
</select>
<select size="8" name="src1" multiple>
<option value="1">Tindy省石油物资设备公司</option>
</select></td>
<td width="61" valign="middle">
 
<input type="button" value=" > " name="B3" onclick="move1to2('form1','src1','src2')" style="background-color: #FFFFF4; border: 1 ridge #C0C0C0"><br>
<br>
 
<input type="button" value=" < " name="B4" onclick="move2to1('form1','src1','src2')" style="background-color: #FFFFF4; border: 1 ridge #C0C0C0"><br>
<br>
 
<input type="button" value=" >> " name="B5" onclick="moveto2('form1','src1','src2')" style="background-color: #FFFFF4; border: 1 ridge #C0C0C0"><br>
<br>
 
<input type="button" value=" << " name="B6" onclick="moveto1('form1','src1','src2')" style="background-color: #FFFFF4; border: 1 ridge #C0C0C0"></td>
<td width="241">  <select size="8" name="src2" multiple>
</select></td>
</tr>

</center>
</div>
</form>
<script>
form1.src2.style.pixelWidth=form1.src1.scrollWidth;//让2个select一样的宽,是个好东东
</script>

关键词:俺的小作品:根据下拉下文动态在下文框中显示,并完成2个下文框互斥选择




Copyright © 2012-2018 争怎路由网(http://www.zhengzen.com) .All Rights Reserved 网站地图 友情链接

免责声明:本站资源均来自互联网收集 如有侵犯到您利益的地方请及时联系管理删除,敬请见谅!

QQ:1006262270   邮箱:kfyvi376850063@126.com   手机版