|
下拉列表文本移动
在js中还有许多有用的东西，今天编写了将下拉列表中的值移动到另一个下拉列表中
实现效果如图：
将左边的单个文本移向右边1-1
将右边的单个文本移向左边1-2
将左边的多个文本移向右边1-1
将右边的多个文本移向左边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> | 
京ICP备14020293号-2
本网站内容均收集于互联网，如有问题请联系QQ:389897944予以删除
窥视卡
雷达卡
楼主
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
显身卡