本文實例講述了js實現Select列表各項上移和下移的方法。分享給大家供大家參考。具體如下：
這里介紹Select列表各項上移和下移的Js代碼，可以手功排序，以前我們都見到過的，從事WEB編程的朋友經常會用得到。
運行效果如下圖所示：
在線演示地址如下：
http://demo.VeVB.COm/js/2015/js-select-move-up-down-codes/
具體代碼如下：
<html><head><title>Select列表各項上移和下移</title><script>function move(index,to) {var list = document.form.list;var total = list.options.length-1;if (index == -1) return false;if (to == +1 && index == total) return false;if (to == -1 && index == 0) return false;var items = new Array;var values = new Array;for (i = total; i >= 0; i--) {items[i] = list.options[i].text;values[i] = list.options[i].value;}for (i = total; i >= 0; i--) {if (index == i) {list.options[i + to] = new Option(items[i],values[i + to], 0, 1);list.options[i] = new Option(items[i + to], values[i]);i--;}else {list.options[i] = new Option(items[i], values[i]); }}list.focus();}function submitForm() {var list = document.form.list;var theList = "?";for (i = 0; i <= list.options.length-1; i++) { theList += "list" + list.options[i].value + "=" + list.options[i].text;if (i != list.options.length-1) theList += "&";}location.href = document.form.action + theList;}</script></head><body><form method="GET" action="" name="form"><table><tr><td align="middle"><select name="list" size="4"><option value="1">ASP</option><option value="2">PHP</option><option value="3">JSP</option><option value="4">JAVA</option></select><br><br><input type="button" value="submit" onClick="submitForm()"></td><td valign="top"><input type="button" value="↑" onClick="move(this.form.list.selectedIndex,-1)"><br><br><input type="button" value="↓"onClick="move(this.form.list.selectedIndex,+1)"></td></tr></table></form></body></html>希望本文所述對大家的javascript程序設計有所幫助。
新聞熱點
疑難解答
