两个Select 之间的值的传递

运行效果:

下面是代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<META NAME="Generator" CONTENT="EditPlus"> 
<META NAME="Author" CONTENT=""> 
<META NAME="Keywords" CONTENT=""> 
<META NAME="Description" CONTENT=""> 
<SCRIPT LANGUAGE="JavaScript"> 
<!-- 
    /** 
    *移动全部 
    */ 
    function moveAll(moveto){ 
        //取得两个对象 
        var sel0=document.getElementById("name1"); 
        var sel2=document.getElementById("name2"); 
        //如果要把右侧数据全移到左侧则调换两个对象 
        if(moveto=='left'){ 
            sel0=document.getElementById("name2"); 
            sel2=document.getElementById("name1");

        } 
        var length=sel0.options.length; 
        for(var i=0;i<length;i++){ 
            var tem=sel0.options[0]; 
            sel2.appendChild(tem); 
        } 
    }

    /** 
    *移动部分 
    *name1被移动的对象 
    *name2目标对象 
    */ 
    function move(name1,name2){ 
        var sel0=document.getElementById(name1); 
        var sel2=document.getElementById(name2); 
        var length=sel0.options.length; 
        for(var i=length-1;i>=0;i--){ 
            var tem=sel0.options[i]; 
            if(tem.selected){ 
                sel2.appendChild(tem); 
            } 
        } 
    } 
//--> 
</SCRIPT> 
</HEAD>

<BODY> 
<form name="form1"> 
<table><tr><td> 
<select id="name1" name="name1" multiple="true" style="width:120" size="5"> 
<option value="1">1</option> 
   <option value="2">2</option> 
    <option value="3">3</option> 
   <option value="4">4</option> 
    <option value="5">5</option> 
     <option value="6">6</option> 
      <option value="7">7</option> 
       <option value="8">8</option> 
    </select> 
    </td> 
    <td> 
    <table><tr><td align="center"> 
    <input type="button" value="全部<<" onclick="moveAll('left')"/> 
    </td> 
    </tr><tr> 
    <td align="center"> 
    <input type="button" value="<<" onclick="move('name2','name1')"/> 
    </td> 
    </tr><tr> 
    <td align="center"> 
    <input type="button" value=">>" onclick="move('name1','name2')"/> 
    </td> 
    </tr><tr> 
    <td align="center"> 
    <input type="button" value="全部>>" onclick="moveAll('right')"/> 
    </td></tr> 
    </table> 
    </td> 
    <td> 
    <select name="name2" id="name2" multiple="true" style="width:120" size="5"> 
    </select> 
    </td> 
    </tr> 
    </table 
    </form> 
</BODY> 
</HTML>

可以按“shift”选择多个

原文地址:http://blog.csdn.net/ayueiloveyou/archive/2008/08/03/2760882.aspx

posted @ 2013-10-19 17:34  dapeng888  阅读(382)  评论(0编辑  收藏  举报