JavaScript移动下拉框选项

效果如图:

<script type="text/javascript">
function moveOptions(oSource, oTarget) {
  
while (oSource.selectedIndex > -1{
    
var opt = oSource.options[oSource.selectedIndex];
    
var newOpt = document.createElement("OPTION");
    oTarget.appendChild(newOpt);
    newOpt.value 
= opt.value;
    newOpt.text 
= opt.text;
    newOpt.selected 
= true;
    oSource.removeChild(opt);
  }

}

</script>

<div style="float:left;">
已选:
<br />
<select name="projectMemberList" multiple="yes" size="9" style="100px;" id="projectMemberList">
<option value="xxx">x01</option>
<option value="xxx">x02</option>
</select>
</div>
<div style="float:left;margin:0px 5px;">
<br />
<br />
<br />
<input type="button" value="<-添加"
onclick
="moveOptions(document.getElementById('userList'),document.getElementById('projectMemberList'));" />
<br />
<br />
<input type="button" value="移除->"
onclick
="moveOptions(document.getElementById('projectMemberList'),document.getElementById('userList'));" />
</div>
<div style="float:left;">
备选:
<br />
<select multiple="yes" size="9" style="100px;" id="userList">
<option value="xxx">x03</option>
<option value="xxx">x04</option>
<option value="xxx">x05</option>
<option value="xxx">x06</option>
<option value="xxx">x07</option>
<option value="xxx">x08</option>
<option value="xxx">x09</option>
<option value="xxx">x10</option>
<option value="xxx">x11</option>
</select>
</div>


from:http://www.iecn.cn/article-html-itemid-2284-type-blog.html
原文地址:https://www.cnblogs.com/yiki/p/759525.html