本次講的是兩個表格之間數據的移動，左邊的表格移動到右邊，並且左邊表格移動內容消失。
<head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title></title> <style type="text/css"> select { width: 100px; position: relative; float: left; } #div-out { width: 100px; position: relative; float: left; height: 113px; /*border: 1px solid black;*/ } #div-in { width: 50px; /*border: 1px solid red;*/ margin: 0px auto; } input { margin-top: 22px; width: 50px; } </style> </head> <body> <select id="s1" size="7" multiple="multiple"> <option>AAA</option> <option>BBB</option> <option>CCC</option> <option>DDD</option> <option>EEE</option> </select> <div id="div-out"> <div id="div-in"> <input type="button" value=">>>" onclick="toright()" /> <input type="button" value="<<<" onclick="toleft()" /> </div> </div> <select id="s2" size="7" multiple="multiple"></select> </body> </html> <script type="text/javascript"> var opt = document.getElementById("s1").options; function toright() { for(var i = 0; i < opt.length; i++) { if(opt[i].selected){ // var opt_temp = document.createElement("option"); // opt_temp.innerText = opt[i].text; // alert(opt[i].text); document.getElementById("s2").appendChild(opt[i]); // document.getElementById("s1").removeChild(opt[i]); i--; } } } </script>這是往右移動，往左邊移動同理。
