<!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=gb2312" />
<title>无标题文档</title>
<script language="javascript">
function transToRight(){
var leftItems = document.getElementById("leftItems");
var itemsOptions = leftItems.options;
var itemsLength = itemsOptions.length;
var chooseLefts = new Array();
var indexs = new Array();
var index = 0;
for(var i = 0; i < itemsLength; i++){
if(itemsOptions[i].selected == true){
chooseLefts[index] = itemsOptions[i].value;
indexs[index] = i;
index++;
}
}
index = 0;
for(var i = 0;i < indexs.length;i++){
leftItems.removeChild(itemsOptions[indexs[i]-index]);
index++;
}
var rightList = document.getElementById("rightItems");
var newRightItem;
var rightText;
for(var i = 0; i < chooseLefts.length; i++){
newRightItem = document.createElement("option");
rightText = document.createTextNode(chooseLefts[i]);
newRightItem.appendChild(rightText);
rightList.appendChild(newRightItem);
}
}
function transToLeft(){
var rightItems = document.getElementById("rightItems");
var itemsOptions = rightItems.options;
var itemsLength = itemsOptions.length;
var chooseRights = new Array();
var indexs = new Array();
var index = 0;
for(var i = 0; i < itemsLength; i++){
if(itemsOptions[i].selected == true){
chooseRights[index] = itemsOptions[i].value;
indexs[index] = i;
index++;
}
}
index = 0;
for(var i = 0;i < indexs.length;i++){
rightItems.removeChild(itemsOptions[indexs[i]-index]);
index++;
}
var leftList = document.getElementById("leftItems");
var newLeftItem;
var leftText;
for(var i = 0; i < chooseRights.length; i++){
newLeftItem = document.createElement("option");
leftText = document.createTextNode(chooseRights[i]);
newLeftItem.appendChild(leftText);
leftList.appendChild(newLeftItem);
}
}
</script>
</head>
<body>
<table>
<tr>
<td>
<select id="leftItems" name="select" size="8" multiple="multiple" style="width:100px; height:200px; border:1px solid green;">
<option>黄增</option>
<option>李三</option>
<option>废话</option>
</select>
</td>
<td>
<input type="submit" name="Submit" value="-->" onclick="transToRight()"/><br />
<input type="submit" name="Submit2" value="<--" onclick="transToLeft()"/>
</td>
<td>
<select id="rightItems" name="select" size="8" multiple="multiple" style="width:100px; height:200px; border:1px solid green;">
<option>asp</option>
<option>jsp</option>
<option>php</option>
</select>
</td>
</tr>
</table>
</body>
</html>