写的一个双向选择器(JS)

<! 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 >
     < meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312"   />
     < title > Web双向选择器 </ title >

< script  type ="text/javascript"  language ="javascript" >
   function moveItem(dest, source)
   {
        var dest   = ( typeof dest == "string" ? document.getElementById(dest): dest );
        var source = ( typeof source  == "string" ? document.getElementById(source) : source );

        if( source.tagName.toLowerCase() != "select" || dest.tagName.toLowerCase() != "select" )
            return;

        for ( index=source.length - 1; index >= 0; index-- ) {
            if ( source[index].selected ) {
                dest.length++;                    
                dest[dest.length-1].id    = source[index].id;
                dest[dest.length-1].value = source[index].value;
                dest[dest.length-1].text  = source[index].text;
                source[index] = null;
            }
        }
    }
</ script >

< style  type ="text/css" >

select
{}{
    margin:-2px;
}
</ style >
</ head >
< body >
     < table  width ="200"  border ="0"  cellpadding ="0"  cellspacing ="0" >
         < tr >
             < td >
        
                 < select  size ="6"  multiple ="multiple"  id ="left"  ondblclick ="moveItem(right,this)" >
                     < option  value ="def" > ListItem1 </ option >
                     < option  value ="abcd" > ListItem2 </ option >
                 </ select >

             </ td >
             < td >

                 < input  type ="button"  value =" > "  name ="btnRight"  onclick ="moveItem(right,left)"   />
               
                 < input  type ="button"  value =" < "  onclick ="moveItem(left,right)"  id ="btn"  name ="btnLeft"   />

             </ td >
             < td >
        
                 < select  size ="6"  multiple ="multiple"  id ="right"  ondblclick ="moveItem(left,this)" >
                     < option  value ="abc" > ListItemm3 </ option >
                     < option  value ="def" > ListItem4 </ option >
                     < option  value ="abcd" > ListItem5 </ option >
                     < option  value ="abc" > ListItem6 </ option >
                     < option  value ="def" > ListItem7 </ option >
                     < option  value ="abcd" > ListItem8 </ option >
                 </ select >
        
             </ td >
         </ tr >
     </ table >
</ body >
</ html >

转载于:https://www.cnblogs.com/CSharp/archive/2006/06/04/416991.html