用js实现两个select下拉框之间的元素互相移动

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>    </head>    <body>                <select id="leftBox" multiple="multiple" style="height: 200px; width: 100px;">            <option value="1">a</option>            <option value="2">b</option>            <option value="3">c</option>            <option value="4">d</option>        </select>        <input type="button" value=">" onclick="move('leftBox','rightBox')"/>        <input type="button" value="<" onclick="move('rightBox','leftBox')"/>        <!--<input type="button" value=">>" onclick="moveAll('leftBox','rightBox')"/>        <input type="button" value="<<" onclick="moveAll('rightBox','leftBox')"/>    -->    <select id="rightBox" multiple="multiple" style="height: 200px; width: 100px;">            <option value="11">A</option>            <option value="22">B</option>            <option value="33">C</option>            <option value="44">D</option>        </select>            </body></html><script type="text/javascript">           // 移動id為from的列表中的選中項到id為to的列表中          function move(from,to) {                // 獲取移動源              var fromBox = document.getElementById(from);                // 獲取移動目的地              var toBox = document.getElementById(to);              // 當移動源存在選中項時              while(fromBox.selectedIndex != -1){                  // 將移動源中的選中項添加到移動目的地的末尾                  toBox.appendChild(fromBox.options[fromBox.selectedIndex]);              }          }         </script>

文章转载于:https://www.cnblogs.com/shenzikun1314/p/6247592.html

原著是一个有趣的人,若有侵权,请通知删除

本博客所有文章如无特别注明均为原创。
复制或转载请以超链接形式注明转自起风了，原文地址《用js实现两个select下拉框之间的元素互相移动》