如题:有两个下拉框:
<td width="15%">
<html:select multiple="multiple" size="25" property="cellphone" name="form" style='width:130px;'>
<html:option value="">所有联系人</html:option>
<html:optionsCollection name="pageList" value="cellphone" label="username"/>
</html:select>
</td>
<td width="11%" align="center">
<input type="button" id="add1" name="add1" value=">>" class="navibutton" onclick="copyToList ('cellphone','selectAbId')"><br><br>
</td>
<td width="15%">
<select name="selectAbId" multiple="multiple" size="25" style='width:130px;'>
<option value="">从左边选择联系人</option>
</select>
</td>
怎么把选择的cellphone选项添加到selectAbId中,同时把cellphone中被选中的删除?用js怎么实现?
这是我的js:
function copyToList(from,to) //from表示:包含可选择项目的select对象名字 to表示:列出可选择项目的select对象名字 //你可以根据你的具体情况修改
{
var fromList =document.getElementsByName("cellphone")[0];
var toList = document.getElementsByName("selectAbId")[0];
alert("断点11111111");
if (toList.options.length > 0 && trim(toList.options[0].value) == ""){
toList.options.length = 0;
}
alert("断点22222222");
var sel = false;
for (i=0;i<fromList.options.length;i++){
var current = fromList.options[i];
if (current.selected){
sel = true;
if (trim(current.value) == "" || current.value.length==0){
alert ('你不能选择这个联系人!');
return;
}
txt = current.text;
val = current.value;
toList.options[toList.length] = new Option(txt,val);
fromList.options[i] = null;
i--;
}
}
if (!sel) alert ('你还没有选择任何联系人');
}
当点击按钮时,只弹出了“断点11111111”,“断点2222222”没有弹出,把“断点11111111”、“断点2222222”之间的代码删掉,“断点2222222”也可以弹出,这是怎么回事,若是有直接实现这个功能的js也行,请大家帮帮忙。。。。谢了,急需、、、
------解决方案--------------------
参照DHTML手册,里面有很详细的对下拉框增加、删除选项操作例子:
- HTML code
<SELECT ID="oSelect"><OPTION VALUE="1">One</OPTION></SELECT><SCRIPT>var oOption = document.createElement("OPTION");oSelect.options.add(oOption);oOption.innerText = "Two";oOption.value = "2";</SCRIPT>object.remove(iIndex)
------解决方案--------------------
- JScript code
function moveOption(e1,e2){ for(var i=0;i<e1.options.length;i++){ if(e1.options[i].selected){ var e = e1.options[i]; e2.options.add(new Option(e.text, e.value)); e1.remove(i); i=i-1 } }}
------解决方案--------------------
最好是给你的下拉框设一个id,给你三个方法,希望对你有用:
/**
* @see 获得对象
* @param id 对象的id(表单元素和其他标签都可以)
* @return Object
*/
function $(id) {
return document.getElementById(id);
}
/**
* @see 清空下拉框
* @param id 下拉框的ID
* @param count 表示要保留的选项数目
*/
function clearSelect(id, count) {