首页 > 代码库 > select框右移-html
select框右移-html
<!DOCTYPE html><html><head><title>checkbox练习</title><meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="this is my page"><meta http-equiv="content-type" content="text/html; charset=UTF-8"><script type="text/javascript"> window.onload = function() { /* 关于功能实现 1.怎样可以让左边的一项移动到右边? 怎样得到select中的选中项? select.options;----得到所有的option的数组. select有一个属性叫selectIndex。得到被选中项的索引. var option=select.options[select.selectIndex]----得到了被选中的项。 rightSelect.add(option); */ //向右移动一个. document.getElementById("removeRightOnly").onclick = function() { //得到左边select中选中的项. var left = document.getElementById("left"); //得到左边的select var option = left.options[left.selectedIndex]; //得到左边选的项. document.getElementById("right").add(option); }; /* 2.怎样将左边的全部移动的右边。 options得到全部，编列所有的，使用rightSelect.add将所有的添加到右边就可以。 */ document.getElementById("removeRightAll").onclick = function() { //得到左边的全部 var left = document.getElementById("left"); var ops=left.options; //得到左边全部的option //遍历每一个option，将其添加到右边. while(ops.length>0){ document.getElementById("right").add(ops[0]); } }; }</script></head><body> <table align=‘center‘> <tr> <td><select size="10" id="left"> <option>选项1</option> <option>选项2</option> <option>选项3</option> <option>选项4</option> <option>选项5</option> <option>选项6</option> <option>选项7</option> <option>选项8</option> <option>选项9</option> </select></td> <td><input type="button" value="--->" id="removeRightOnly"><br> <input type="button" value="===>" id="removeRightAll"><br> <input type="button" value="<---" id="removeLeftOnly"><br> <input type="button" value="<===" id="removeLeftAll"><br> </td> <td><select size="10" id="right"> <option>选项10</option> </select></td> </tr> </table></body></html>
select框右移-html
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。