下拉列表文本的移动
下拉列表文本移动在js中还有许多有用的东西，今天编写了将下拉列表中的值移动到另一个下拉列表中
实现效果如图：
http://dl.iteye.com/upload/attachment/442974/92371cc5-d237-33dd-a3a1-0beb34201848.jpg
将左边的单个文本移向右边1-1
http://dl.iteye.com/upload/attachment/442976/ffb1b677-f328-34cb-b2db-1fe099794dc7.jpg
将右边的单个文本移向左边1-2
http://dl.iteye.com/upload/attachment/442978/83924f7d-e13d-33ba-90d2-fa98754d4e02.jpg
将左边的多个文本移向右边1-1
http://dl.iteye.com/upload/attachment/442980/141ea2c1-c07f-356f-a142-38a09bf1e708.jpg
将右边的多个文本移向左边1-2
网页文本代码：
<body> <span><select id="lselect" size="7" style="width: 100px; background-color: red" multiple="multiple"> <option>选项1</option> <option>选项2</option> <option>选项3</option> <option>选项4</option> <option>选项5</option> <option>选项6</option> <option>选项7</option> </select> </span> <span style="width: 200px; height: 100px;"> <input type="button" value="单个向右移" /> <input type="button" value="多个向右移" /> <input type="button" value="单个向左移" /> <input type="button" value="多个向左移" /> </span> <span> <select id="rselect"size="7" style="width: 100px; background-color: blue" multiple="multiple"> </select> </span> </body>
Js实现代码：
<script type="text/javascript"><!--window.onload=function(){}function oneRMove(){ var lselect=document.getElementById("lselect"); var rselect=document.getElementById("rselect"); var loptions=lselect.options; for(var i=0;i<loptions.length;i++){ var op=loptions; if(op.selected){ rselect.appendChild(op); break; }}}function moreRMove(){ var lselect=document.getElementById("lselect"); var rselect=document.getElementById("rselect"); var loptions=lselect.options; for(var i=0;i<loptions.length;i++){ var op=loptions; if(op.selected){ rselect.appendChild(op); i--; } }}function oneLMove(){ var lselect=document.getElementById("lselect"); var rselect=document.getElementById("rselect"); var roptions=rselect.options; for(var i=0;i<roptions.length;i++){ var op=roptions; if(op.selected){ lselect.appendChild(op); break; }}}function moreLMove(){ var lselect=document.getElementById("lselect"); var rselect=document.getElementById("rselect"); var roptions=rselect.options; for(var i=0;i<roptions.length;i++){ var op=roptions; if(op.selected){ lselect.appendChild(op); i--; } }}//--></script>
页:
[1]