支持多选的select 博客分类： javascript 支持多选的select
程序员文章站
2024-03-16 09:53:04
...
<html>
<head>
<title>支持多选的select</title>
</head>
</body>
全部添加与部分添加的实现：
<table border=0 cellpadding=0 cellspacing=0>
<form name=meizz>
<tr>
<td>
<select name=list1 size=8 multiple ondblclick="moveOption(this, this.form.list2)">
<option value=A>aaaaaaaaaa
<option value=B>bbbbbbbbbb
<option value=C>cccccccccc
<option value=D>dddddddddd
<option value=E>eeeeeeeeee
<option value=F>ffffffffff
<option value=G>gggggggggg
<option value=H>hhhhhhhhhh
</select>
</td>
<td width=40 align=center>
<input name=add type=button value=">>>" onclick="moveOption(this.form.list1,this.form.list2)">
<br/><br/>
<input name=sub type=button value="<<<" onclick="moveOption(this.form.list2,this.form.list1)">
</td><td>
<select name=list2 size=8 multiple ondblclick="moveOption(this, this.form.list1)"></select>
</td>
</tr>
</form>
</table>
<script language="javascript">
function moveOption(obj1, obj2){
//try{
var length=obj1.options.length-1;
for(i=0;i<=length;i++){
var e = obj1.options[obj1.selectedIndex];
obj2.options.add(new Option(e.text,e.value));
obj1.options.remove(obj1.selectedIndex);
}
//}catch(e){
// alert(e);
//}
}
</script>
</body>
</html> 推荐阅读
-
支持多选的select 博客分类： javascript 支持多选的select
-
支持多选的select 博客分类： javascript 支持多选的select
-
验证是否支持html5的Video标签及MP4视频播放 博客分类： web前端 html5验证videoMP4javascript
-
下拉框被选中 博客分类： javascript 下拉框被选中select被选中option被选中获取lang的值
-
jquery获取下拉框当前选项的显示名称 博客分类： javascript js获取下拉框的显示值js取select中option的显示值jquery获取下拉框的显示值
-
选择控件：select ，radio，checkbox之用jquery获取选中值的小结 博客分类： jQuery select下拉框radio单选按钮checkbox多选框jquery获取选中的值
-
彻底解决div总是被select遮挡的问题 博客分类： JavaScript 制造XHTMLHTML
-
把json对象转换成字符串形式，用以保存，支持带数组的 博客分类： Javascript
-
把json对象转换成字符串形式，用以保存，支持带数组的 博客分类： Javascript
-
多选下拉框的回显（Select) 博客分类： jQuery 多选下拉框Select回显选中