javascritpt对select中options的上下移动

来源:互联网 发布:怎样接淘宝上安装的活 编辑:程序博客网 时间:2024/05/19 00:53
不多说了,代码很简单,上代码,感觉不错的方法,分享一下<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head>    <title>optionsMove</title>    </head><body>    <select id="TestSelect" size="20" style="width: 100px">        <option>新中国1</option>        <option>新中国2</option>        <option>新中国3</option>        <option>新中国4</option>        <option>新中国5</option>        <option>新中国6</option>        <option>新中国7</option>        <option>新中国8</option>    </select>    <input type="button" value="上移" onclick="OptionUpOrDown(1,'TestSelect');" />    <input type="button" value="下移" onclick="OptionUpOrDown(0,'TestSelect');" />    <script type="text/javascript">        function OptionUpOrDown(direct, selectId) {         //direct: 1.上移  2.下移            var obj = document.getElementById(selectId);            var len = obj.length;            var index = obj.selectedIndex;          //简单判断            if ((index == -1) || (direct == 1 && index == 0) || (direct == 0 && index >= len - 1))                return;            var tempOptions = new Array();            //如是向上,得到选中项上一个到最后的option数组;如是向下,得到选中项到最后一项的option数组            for (var i = index - direct; i < len; i++)                tempOptions[tempOptions.length] = obj.options[i];          //去掉数组中项            obj.options.length = index - direct;         //保存在数组中的前两项交换            obj.options.add(tempOptions[1]);            obj.options.add(tempOptions[0]);        //把数组中剩下内容添加到select中            for (var i = 2; i < tempOptions.length; i++)                obj.options.add(tempOptions[i]);        }    </script></body></html>


原创粉丝点击