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>