Copy code code as follows:
<html>
<head>
<Title> JavaScript Edition select the drop -down menu to move and sort it </Title>
<meta http-equiv = "content-type" content = "text/html; charset = gb2312">
</head>
<body>
<p> Select one or more, then click to add or remove (you can choose multiple selection of Shift or CTRL), or double -click to the selection item for addition and remove. </p>
<FORM METHOD = "Post" name = "Myform">
<Table>
<tr>
<TD>
<selet multiple name = "list1" size = "12" ondblClick = "MoveOption (Document.myform.List1, Document.myform.list2)">
<option value = "Beijing"> Beijing </option>
<option value = "Shanghai"> Shanghai </option>
<option value = "Shandong"> Shandong </option>
<option value = "Anhui"> Anhui </option>
<option value = "Chongqing"> Chongqing </option>
<option value = "Fujian"> Fujian </option>
<option value = "Gansu"> Gansu </option>
<option value = "Guangdong"> Guangdong </option>
<option value = "Guangxi"> Guangxi </option>
<option value = "Guizhou"> Guizhou </option>
<option value = "Hainan"> Hainan </option>
<option value = "Hebei"> Hebei </option>
<option value = "Heilongjiang"> Heilongjiang </option>
<option value = "Henan"> Henan </option>
<option value = "Hubei"> Hubei </option>
<option value = "Hunan"> Hunan </option>
<option value = "Inner Mongolia"> Inner Mongolia </option>
<option value = "Jiangsu"> Jiangsu </option>
<option value = "Jiangxi"> Jiangxi </option>
<option value = "Jilin"> Jilin </option>
<option value = "Liaoning"> Liaoning </option>
<option value = "Ningxia"> Ningxia </option>
<option value = "Qinghai"> Qinghai </option>
<option value = "Shanxi"> Shanxi </option>
<option value = "Shaanxi"> Shaanxi </option>
<option value = "Sichuan"> Sichuan </option>
<option value = "Tianjin"> Tianjin </option>
<option value = "Tibet"> Tibet </option>
<option value = "Xinjiang"> Xinjiang </option>
<option value = "Yunnan"> Yunnan </option>
<option value = "Zhejiang"> Zhejiang </option>
<option value = "Hong Kong"> Hong Kong </option>
<option value = "Macau"> Macau </option>
<option value = "Taiwan"> Taiwan </option>
<option value = "other"> other </option>
</select>
</td>
<td align = "center">
<input type = "Button" Value = ">>" Onclick = "MoveOption (Document.myform.List1, Document.myform.List2)"> <br />
<br />
<input type = "Button" Value = "<<" "Onclick =" MoveOption (Document.myform.List2, Document.myform.List1) ">">
</td>
<TD>
<selet multiple name = "list2" size = "12" wdblClick = "MoveOption (document.myform.list2, document.myform.list1)">
</select>
</td>
<TD>
<button OnClick = "Changepos (list2, -1)" Type = "Button">
On </Button>
<br />
<button OnClick = "Changepos (list2,1)" Type = "Button">
On </Button>
</td>
</tr>
</table>
Value: <input type = "text" name = "city" size = "40">
</form>
<script language = "javascript">
<!--
Function MoveOption (E1, E2) {{
try {
for (var I = 0; I <e1.Options.Length; I ++) {
if (E1.Options [i] .select) {{
var e = e1.Options [i];
e2.Options.add (New Option (E.Text, E.Value));
e1.remove (i);
i = i -1
}
}
document.myform.city.Value = getValue (document.myform.list2);
}
catch (e) {}
}
function getValue (geto) {
var allvalue = "";
for (var I = 0; I <Geto.Options.length; I ++) {
allvalue + = geto.Options [i]. Value + ","
}
Return allvalue;
}
Function Changepos (Obj, Index) {
if (index == -1) {{
if (obj.selectEdindex> 0) {{
obj.options (Obj.selectEdex) .swapnode (obj.options (obj.selectEx -1))
}
}
else if (index == 1) {{
ifj.SelectEdindex <obj.options.Length -1) {{
obj.options (Obj.selectEdex) .swapnode (obj.options (obj.selectindindex + 1))
}
}
}
//->
</script>
</body>
</html>