select下拉域,左右增加,和移除
//增加
function addOption(){
var selectconfig=form.selectconfig.value;
//获取显示值
var selectconfigvalue=document.getElementById("selectconfig").options[document.getElementById("selectconfig").selectedIndex].text;
var selectnews=document.getElementById("selectnew");
if (selectconfig=="") {
alert ("请选择添加项");
return false;
}
var i=0;
var b=true;
for(var j=0;j<selectnews.options.length;j++){
if (selectconfig==selectnews.options[j].text){
b=false;
}
}
if(b){
i++;
selectnews.options.add(new Option(selectconfigvalue,selectconfig),i);
}
}
//删除
function delOption(){
var selectnews=form.selectnew.value;
if (selectnews=="") {
alert ("请选择删除项");
return false;
}
var length2=document.getElementById("selectnew");
length2.options.remove(length2.options.selectedIndex);
}
<table width="770" align="center">
<tr>
<td>字段列表<br/>
<SELECT size=10 name="selectconfig" id="selectconfig" style="width=200px">
<OPTION value="title">标题</OPTION>
<OPTION value="message">描述</OPTION>
</SELECT>
</td>
<td><input type="button" name="" value="添加--->" onclick="addOption();">
<br/>
<br/>
<input type="button" name="" value="<---移除" onclick="delOption();"></td>
<td>已选列表<br/>
<SELECT size=10 name="selectnew" id="selectnew" style="width=200px">
</SELECT>
</td>
</tr>
</table>