<html><head>
<script language="javascript">
function moveOption(oFromList, oToList, bAll)
{
  var nFromLen = oFromList.options.length;
  var nToLen = oToList.options.length;
  var i = 0;
  while (nFromLen > 0)
  {
if (oFromList.options[i].selected || bAll)
{
oToList[nToLen++] = new Option(oFromList.options[i].text, oFromList.options[i].value);
oFromList.options[i] = null;
}
else
i++;

nFromLen--;
  }  sortOption(oToList);
}function compare(a,b)
{
  if (a.text < b.text)
return -1;
  else if (a.text > b.text)
return 1;
  return 0;
}function sortOption(oList)
{
   if (oList.options.length > 1)
   {
        var optionList  = new Array();        for (var i=0; i < oList.options.length; i++)
  optionList.push(oList.options[i]); optionList.sort(compare);     oList.length = 0;
        for (var i=0; i < optionList.length; i++)
  oList.options[i] = optionList[i];
   }   
}
</script>
</head><body>
<form name="form1">
<table align=center>
 <tr>
   <td>
<select name="leftlist" multiple size="4">
<option value="1">fason1</option>
<option value="2">fason2</option>
<option value="3">fason3</option>
<option value="4">fason4</option>
</select>
   </td>
   <td>
<input type="button" value=" << " onclick="javascript:moveOption(rightlist, leftlist,true)"><br>
<input type="button" value=" <  " onclick="javascript:moveOption(rightlist, leftlist,false)"><br>
<input type="button" value=" >  " onclick="javascript:moveOption(leftlist, rightlist,false)"><br>
<input type="button" value=" >> " onclick="javascript:moveOption(leftlist, rightlist,true)">
   </td>
   <td>
<select name="rightlist" multiple  size="4">
</select>
   </td>
 </tr>
</table>
   <p align="right"><a href="http://fason.nease.net">【阿信的小天地】</a></p>
</body></html>