下面这个再开发好多系统中应该都有用到吧：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>select</title>
</head>
<script language="JavaScript" type="text/javascript">
<!--
function moveOption1(e1, e2){
try{
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;
}
}
document.myform.msgto.value=getvalue(document.myform.list2);
}
catch(e){}
}
function moveOption2(e1, e2){
try{
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;
}
}
document.myform.msgto.value=getvalue(document.myform.list2);
}
catch(e){}
}
function getvalue(geto){
var allvalue = "";
for(var i=0;i<geto.options.length;i++){
allvalue +=geto.options[i].value + ",";
}
return allvalue;
}
function moveAllOption1(e1, e2){
try{
for(var i = 0;i < e1.options.length; i++){
var e = e1.options[i];
e2.options.add(new Option(e.text, e.value));
e1.remove(i);
i = i - 1;
}
document.myform.msgto.value=getvalue(document.myform.list2);
}
catch(e){
}
}
function moveAllOption2(e1, e2){
try{
for(var i = 0;i < e1.options.length; i++){
var e = e1.options[i];
e2.options.add(new Option(e.text, e.value));
e1.remove(i);
i = i - 1;
}
document.myform.msgto.value=getvalue(document.myform.list2);
}
catch(e){
}
}
-->
</script>
<body>
<form method="post" name="myform" onsubmit="return checkdata();">
<div style=" padding-bottom:20px;">
<table border="0" width="100%" style="">
<tr>
<td bgcolor="#3399CC" width="13%"><select style="width:100%;" multiple name="list1" size="15" ondblclick="moveOption1(document.myform.list1, document.myform.list2)">
<option >111</option><option >222</option><option >333</option><option >444</option><option >555</option><option >666</option>
</select>
</td>
<td width="10%" align="center"><input type="button" value="添加" onClick="moveOption1(document.myform.list1, document.myform.list2)">
<br>
<br>
<input type="button" value="全选" onClick="moveAllOption1(document.myform.list1, document.myform.list2)">
<br>
<br>
<input type="button" value="删除" onClick="moveOption2(document.myform.list2, document.myform.list1)">
<br>
<br>
<input type="button" value="全删" onClick="moveAllOption2(document.myform.list2, document.myform.list1)">
</td>
<td bgcolor="#3399CC" width="13%"><select style="width:100%;" multiple name="list2" size="15" ondblclick="moveOption2(document.myform.list2, document.myform.list1)">
</select>
</td>
<td></td>
</tr>
</table>
</div>
<input type="hidden" name="msgto" value="" />
</form>
</body>
</html>
运行结果图：
下面这个呢在全部删除时用的比较多吧：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
p {margin:0;font-size:12px;line-height:26px;}
</style>
<script type="text/javascript">
function check_all(obj,cName)
{
var checkboxs = document.getElementsByName(cName);
for(var i=0;i<checkboxs.length;i++){checkboxs[i].checked = obj.checked;}
}
</script>
</head>
<body>
<p><input type="checkbox" name="all" onclick="check_all(this,'c')" />全选/全不选</p>
<p><input type="checkbox" name="c" value="" /></p>
<p><input type="checkbox" name="c" value="" /></p>
<p><input type="checkbox" name="c" value="" /></p>
<p><input type="checkbox" name="c" value="" /></p>
</body>
</html>
运行结果图：
