欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页

支持多选的select 博客分类： javascript 支持多选的select 

程序员文章站 2024-03-16 09:41:16
...
<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

上一篇： java gson解析JSON

下一篇： 441. 排列硬币

推荐阅读