<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
function GetValue(){ var objselect = document.all.select;
var selectLen = objselect.length ;
var objtextarea = document.all.textarea; var i;
objtextarea.innerHTML = "";
if(selectLen > 0){ for(i = 0 ;i < selectLen;i++){ if(objselect.options[i].selected==true){
objtextarea.innerHTML = objtextarea.innerHTML + " " + objselect.options[i].value;
}
} }
}
//-->
</SCRIPT>
<BODY>
  <table width="100%" height="282" border="0" cellpadding="0" cellspacing="0">
    <tr> 
      <td width="50%" height="42" rowspan="2">
<input type="button" value="Get Value" onClick="GetValue()">
<select name="select" size="1" multiple style="width:200px;height:200px">
<option value="Test1">Test1</option>
<option value="Test2">Test2</option>
<option value="Test3">Test3</option>
<option value="Test4">Test4</option>
<option value="Test5">Test5</option>
<option value="Test6">Test6</option>
<option value="Test7">Test7</option>
<option value="Test8">Test8</option>
<option value="Test9">Test9</option>
<option value="Test10">Test10</option>
<option value="Test11">Test11</option>
</select>
 </td>
      <td width="50%" height="42" rowspan="2"><textarea name="textarea" style="width:200px;height:200px"></textarea></td>
    </tr>   
  </table>
</BODY>
</HTML>

解决方案 »

  1.   

    一个不难的逻辑流程,下面是些简单的注释:
    <!--
    function GetValue(){var objselect = document.all.select;//取得左边的select;
    var selectLen = objselect.length ;//取得左边的select的option值;
    var objtextarea = document.all.textarea;//取得右边的select;var i;
    objtextarea.innerHTML = "";
    if(selectLen > 0){
    /*
    下面开始遍历左边的select;
    */
    for(i = 0 ;i < selectLen;i++)
    {
    if(objselect.options[i].selected==true)/*如果是被选中*/
    {
    objtextarea.innerHTML = objtextarea.innerHTML + " " + objselect.options[i].value;//就追加到右边的select
    }
    }
    }
    }
    //-->