As follows:
Copy codeThe Code is as follows:
<! 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>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/>
<Title> untitled document </title>
<Script type = "text/javascript">
Function copyToList (from, ){
Var fromList = eval ('document. forms [0]. '+ from );
Var toList = eval ('document. forms [0]. '+ );
If (toList. options. length> 0 & toList. options [0]. value = 'temp '){
ToList. options. length = 0;
}
Var sel = false;
For (I = 0; I <fromList. options. length; I ++ ){
Var current = fromList. options [I];
If (current. selected ){
Sel = true;
If (current. value = 'temp '){
Alert ('This project cannot be selected! ');
Return;
}
Txt = current. text;
Val = current. value;
ToList. options [toList. length] = new Option (txt, val );
FromList. options [I] = null;
I --;
}
}
If (! Sel) alert ('you have not selected any projects yet! ');
}
Function allSelect (){
Var chsen = document. getElementById ('chosen ');
// If the chsen list box is 0 or the first option value is 'temp'
If (chsen. length & chsen. options [0]. value = "temp ")
Return;
For (var I = 0; I <chsen. length; I ++ ){
Chsen. options [I]. selected = true;
}
// Obtain data
Function getdata (){
Var List = document. forms [0]. RoleList;
// Obtain a hidden text box object.
Var roles = document. getElementById ("TRoleList ");
Roles. value = "";
Var s = "";
If (List. length! = 0 ){
For (I = 0; I <List. length; I ++ ){
S + = List. options [I]. value + ",";
}
}
Roles. value = s;
}
}
</Script>
</Head>
<Body>
<Table border = "0">
<Form onSubmit = "allSelect ()">
<Tr>
<Td>
<Select name = "possible" size = "4" MULTIPLE width = "200" style = "width: 200px">
<Option value = "1"> Guangzhou, China </option>
<Option value = "2"> Shanghai, China </option>
<Option value = "3"> Beijing, China </option>
<Option value = "4"> Wuhan, China </option>
</Select>
</Td>
<Td> <a href = "javascript: copyToList ('possible ', 'chosen')"> Add to right --> <br>
<Br>
</A> <a href = "javascript: copyToList ('chosen', 'possible ')"> <-- add to left </a> </td>
<Td>
<Select name = "chosen" size = "4" MULTIPLE width = "200" style = "width: 200px;">
<Option value = "temp"> select your region from the left </option>
</Select>
</Td>
</Tr>
</Form>
</Table>
<Input type = "button" value = "Submit" onclick = "allSelect ()"/> yle
<Input type = "text" style = "display: none;" id = "TRoleList">
</Body>
</Html>