Copy codeThe Code is as follows:
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312">
<Title> list Test </title>
</Head>
<Body>
<Div style = "font-size: 10pt;">
Note 1: Move left and right to select
<Br/>
<Br/>
Note: This page has only been tested in IE6/FireFox1.5. Other browsers or other versions are not tested.
<Br/>
<Hr/>
</Div>
<Form name = "frm">
<Table>
<Tr>
<Td>
<Select name = "SrcSelect" size = "6" style = "font-size: 11pt; width: 160px; height: 160px"
Multiple = "multiple" ondblclick = "moveLeftOrRight (document. frm. SrcSelect, document. frm. ObjSelect)">
<Option value = "1"> instructor </option>
</Select>
</Td>
<Td width = "30px">
<Input align = "left" type = "button" value = ">" onclick = "moveLeftOrRight (document. frm. SrcSelect, document. frm. ObjSelect)">
<Br>
<Br>
<Input align = "left" type = "button" value = "<" onclick = "moveLeftOrRight (document. frm. ObjSelect, document. frm. SrcSelect)">
</Td>
<Td>
<Select name = "ObjSelect" size = "6" style = "font-size: 11pt; width: 160px; height: 160px"
Multiple = "multiple" ondblclick = "moveLeftOrRight (document. frm. ObjSelect, document. frm. SrcSelect)">
<Option value = "2"> teaching administrator </option>
<Option value = "3"> super administrator </option>
</Select>
</Td>
</Tr>
</Table>
</Form>
</Body>
<Script type = "text/javascript" language = "javascript">
// Move up
Function moveUp (){
Var theObjOptions = document. frm. ObjSelect. options;
For (var I = 1; I <theObjOptions. length; I ++ ){
If (theObjOptions [I]. selected &&! TheObjOptions [I-1]. selected ){
SwapOptionProperties (theObjOptions [I], theObjOptions [I-1]);
}
}
}
// Move down
Function moveDown (){
Var theObjOptions = document. frm. ObjSelect. options;
For (var I = theObjOptions. length-2; I>-1; I --){
If (theObjOptions [I]. selected &&! TheObjOptions [I + 1]. selected ){
SwapOptionProperties (theObjOptions [I], theObjOptions [I + 1]);
}
}
}
Function swapOptionProperties (option1, option2 ){
Var tempStr = option1.value;
Option1.value = option2.value;
Option1.value = tempStr;
TempStr = option1.text;
Option1.text = option2.text;
Option2.text = tempStr;
TempStr = option1.selected;
Option1.selected = option2.selected;
Option2.selected = tempStr;
}
// Move the position of the list box
Function moveLeftOrRight (fromObj, toObj ){
For (var I = 0; I <fromObj. length; I ++ ){
Var srcOption = fromObj. options [I];
If (srcOption. selected ){
ToObj. appendChild (srcOption );
I --;
}
}
}
</Script>