多选列表框动态添加,移动,删除,全选 等操作(完整实例)

<%
dim  a
=   split (Request.Form( " sourceList " ), " , " )

Response.Write 
" Source: "   &  Request.Form( " sourceList " &   ubound (a)  &   " <br>Object: "   &  Request.Form( " objectList " &   " <br> "
%>
< html >
< head >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312" >
< title > Untitled Document </ title >
< STYLE  type =text/css >
.bgsubleft 
{
BACKGROUND-POSITION
:  center bottom ;  BACKGROUND-IMAGE :  url(images/bgleft.gif) ;  BACKGROUND-REPEAT :  repeat-x
}
.bgsubleftn 
{
BACKGROUND-POSITION
:  left bottom ;  BACKGROUND-IMAGE :  url(images/bgleftn.gif) ;  BACKGROUND-REPEAT :  no-repeat
}
</ STYLE >
< script  language ="JavaScript"  type ="text/JavaScript" >
function  addSelectedList()
{
var  objSource  =  form1.sourceList;
var  objObject  =  form1.objectList;
var  sourcelen  =  objSource.length ;
for ( var  i = 0 ;i < sourcelen;i ++ ){
    
if  (objSource.options[i].selected){
      
if  ( ! checkExist(objObject,objSource.options[i].value)){
        addtolist(objObject,objSource.options[i].text,objSource.options[i].value);
      }
    }
}
}

function  addAllList()
{
var  objSource  =  form1.sourceList;
var  objObject  =  form1.objectList;
var  sourcelen  =  objSource.length ;
for ( var  i = 0 ;i < sourcelen;i ++ ){
    
if  ( ! checkExist(objObject,objSource.options[i].value)){
      addtolist(objObject,objSource.options[i].text,objSource.options[i].value);
    }
}
}

function  removeSelectedList(noRemoveValue)
{
var  objObject  =  form1.objectList;
for  ( var  i = 0 ;i < objObject.length;i ++ ){
    
if  (objObject.options[i].selected  &&  objObject.options[i].value  !=  noRemoveValue)
    {
      objObject.options.remove(i);
      removeList(noRemoveValue);
break ;
    }
}
}

function  removeAllList(noRemoveValue)
{
var  objObject  =  form1.objectList;
var  objLen  =  objObject.length;
for  ( var  i = 0 ;i < objLen;i ++ ){
    
if  ( objObject.options[i].value  !=  noRemoveValue){
      objObject.options.remove(i);
      removeAllList(noRemoveValue);
break ;
    }
}
}


function  selectedAll(obj)
{
for  ( var  i = 0 ;i < obj.length;i ++ ){
    obj.options[i].selected 
=   true ;
}
}
function  checkExist(obj,value)
{
var  isExist  =   false ;
for  ( var  i = 0 ;i < obj.length;i ++ ){
    
if  (obj.options[i].value  ==  value){
      isExist 
=   true ;
      
break ;
    }
}
return  isExist;
}
function  addtolist(obj,value,label){
obj.add(
new  Option(value,label));
}
</ script >
</ head >

< body  bgcolor ="#FFFFFF" >
< form  name ="form1"  action ="temp.asp"  method ="post" >
< table  width ="200"  border ="0"  cellspacing ="0"  cellpadding ="0" >
< tr >
    
< td >< select  name ="sourceList"  size ="10"  multiple id ="sourceList"  style ="width:150" >
      
< option  value ="a" > 1 </ option >
      
< option  value ="b" > 2 </ option >
      
< option  value ="c" > 3 </ option >
      
<%
      
for  i  =   6   to   20
        Response.Write(
" <option value="" "   &  i + 200   &   " ""> "   &  i + 200   &   " </option> "   &  vbcrlf)
      
Next
      
%>
    
</ select ></ td >
    
< td >< input  name ="add"  type ="button"  id ="add"  value ="Add"  onclick ="addSelectedList()"  style ="width:100" >< br >
      
< input  name ="add"  type ="button"  id ="add"  value ="Add all"  onclick ="addAllList()"  style ="width:100" >< br >    
    
< input  name ="add"  type ="button"  id ="add"  value ="Remove"  onclick ="removeSelectedList('a')"  style ="width:100" >< br >
    
< input  name ="add"  type ="button"  id ="add"  value ="Remove all"  onclick ="removeAllList('a')"  style ="width:100" >
    
< input  name ="add"  type ="button"  id ="add"  value ="Select all"  onclick ="selectedAll(form1.objectList)"  style ="width:100" ></ td >
    
< td >< select  name ="objectList"  size ="10"  multiple id ="objectList"  style ="width:150" >
      
< option  value ="a" > 1 </ option >
      
< option  value ="d" > 4 </ option >
      
< option  value ="e" > 5 </ option >
      
<%
      
for  i  =   6   to   20
        Response.Write(
" <option value="" "   &  i  &   " ""> "   &  i  &   " </option> "   &  vbcrlf)
      
Next
      
%>
    
</ select ></ td >
</ tr >
< tr >
    
< td ></ td >
    
< td >< input  name ="subm"  type ="submit"  value ="Submit"  style ="width:100" ></ td >
    
< td > &nbsp; </ td >
</ tr >
</ table >
</ form >
</ body >
</ html >
 
  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

一把编程的菜刀

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值