多项下拉列表之转移。
style：
<style type="text/css"> *{ margin:0px auto; padding:0px;} #w1{ 700px; height:300px;} #a1{300px; height:300px; float:left; } #zhong{100px; height:300px; float:left;} #a2{50px; height:30px; margin-left:25px; margin-top:60px; } #a3{50px; height:30px; margin-left:25px; margin-top:60px;} #a4{300px; height:300px; float:left;} </style>
body：
<body>
<div id="w1"> <!--用外面的div套起所有的就可以让他们在中间而不是靠左-->
<div>
<select id="a1" multiple="multiple">
<option value="优秀">优秀</option>
<option value="良好">良好</option>
<option value="不错">不错</option>
<option value="继续努力">继续努力</option>
</select>
</div>
<div id="zhong">
<input type="button" value=">>" id="a2" onclick="All()">
<input type="button" value=">" id="a3" onclick="One()">
</div>
<div>
<select id="a4" multiple="multiple">
</select>
</div>
</div>
</body>
script：
function One() { var e=0; var a11=document.getElementById("a1");//获取左边列表id var a44=document.getElementById("a4");//获取右边列表id var a111=a11.value; //现在只是获取了左边的值，还没法让左边的值在右边没有下拉项的情况下出现，所 //以应当弄出下拉项拼接上值。又由于我们想接上的是值，所以要先定义一下 var b111="<option value='"+a111+"'>"+a111+"</option>"; // a44.innerHTML=a44.innerHTML+b111; for(var i=0;i<=a44.length;i++)//必须写<= 因为开始时a44的长度为0 { if(e==a44.length) //右 长度 {
// 右 内容 右 内容 拼接好的左内容 a44.innerHTML=a44.innerHTML+b111; break; }
//左 值 右 位置 值 else if(a111==a44[i].value) { break; } e++;//必须放在if判断外面 for循环里面 //放到if里不会随着for循环次数的增加而增加 } } function All() { var a11=document.getElementById("a1"); var a44=document.getElementById("a4"); a44.innerHTML=a11.innerHTML; }