国产精品㊣新片速递bt,欧美精品三区,性xxxx丰满孕妇xxxx另类

列表框的左右上下移動

Posted on 2009-01-09 16:41 笑看風云閱讀(328) 評論(0) 編輯收藏所屬分類: javascript

效果圖如下：

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>列表框上下左右操作</title>

</head>

<!--

var ListUtil = new Object();

//全部移動

ListUtil.moveAll = function moveAll(oListboxFrom,oListboxTo){

var options = oListboxFrom.options;

for(var i = 0; i < options.length; i++){

oListboxTo.appendChild(options[i]); //???

i -= 1; //???每刪除一個選項后，每個選項的index會被重置

}

//單個或多個移動

ListUtil.moveMuti = function moveMuti(oListboxFrom,oListboxTo){

var options = oListboxFrom.options;

for(var i = 0; i < options.length; i++){

if(options[i].selected){

oListboxTo.appendChild(options[i]);

i -= 1;

}

//上移

ListUtil.shiftUp = function(oListbox) {

if(oListbox.selectedIndex > 0){

var oOption = oListbox.options[oListbox.selectedIndex];

var oPrevOption = oListbox.options[oListbox.selectedIndex-1];

oListbox.insertBefore(oOption,oPrevOption);

}

//下移

ListUtil.shiftDown = function(oListbox){

if(oListbox.selectedIndex < oListbox.options.length-1){

var oOption = oListbox.options[oListbox.selectedIndex];

var oNextOption = oListbox.options[oListbox.selectedIndex+1];

oListbox.insertBefore(oNextOption,oOption);

}

//-->

</script>

<table>

未選員工

<select name="oListboxFrom" id="oListboxFrom" size="10"

multiple="true"

style="width: 100px; height: 250px; margin-left: 20px; float: left">

</select>

</td>

<input type="button" value=" >>> "

onclick="ListUtil.moveAll(oListboxFrom, oListboxTo);" />

<br />

<input type="button" value=" >> "

onclick="ListUtil.moveMuti(oListboxFrom, oListboxTo);" />

<br />

<input type="button" value=" << "

onclick="ListUtil.moveMuti(oListboxTo, oListboxFrom);" />

<br />

<input type="button" value=" <<< "

onclick="ListUtil.moveAll(oListboxTo, oListboxFrom);" />

<br />

<input type="button" value=" ↑ "

onclick="ListUtil.shiftUp(oListboxFrom);" />

<br />

<input type="button" value=" ↓ "

onclick="ListUtil.shiftDown(oListboxFrom);" />

</td>

<td>

已選員工

<select name="oListboxTo" id="oListboxTo" multiple="true"

size="10"

style="width: 100px; height: 250px; margin-left: 20px; float: left">

</select>

</td>

</tr>

</table>

</form>

</body>

</html>

新用戶注冊刷新評論列表


只有注冊用戶登錄后才能發表評論。




網站導航: 博客園 IT新聞 Chat2DB C++博客博問管理
相關文章: jquery基本教程之簡單體驗列表框的左右上下移動控制Checkbox全選的JS js進行有效性驗證 10秒后實現頁面自動跳轉

笑看風云

導航

常用鏈接

留言簿

隨筆分類(26)

隨筆檔案(28)

文章檔案(2)

收藏夾(3)

搜索

積分與排名

最新評論

閱讀排行榜

評論排行榜

列表框的左右上下移動