<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>MoveOptions.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript">
function $(id){
return document.getElementById(id);
}
function moveSelect(src,dest){
var src = $(src);
var dest = $(dest);
var options = src.options;
for(var i=options.length-1; i>=0; i--){
if(options[i].selected){
dest.appendChild(options[i]);
}
}
}
</script>
</head>
<body style="text-align: center" >
<select id="left" multiple="multiple" style="width: 200px;height: 200px">
<option>火德星君</option>
<option>镇河天将</option>
<option>定海神将</option>
<option>镇岳天将</option>
</select>
<input type="button" value=">>>>" onclick="moveSelect('left','right');" />
<input type='button' value='<<<<' onclick="moveSelect('right','left');" />
<select id="right" multiple="multiple" style="width: 200px;height: 200px">
<option>火德星君XX</option>
<option>镇河天将XX</option>
<option>定海神将XX</option>
<option>镇岳天将XX</option>
</select>
</body>
</html>