这篇文章介绍了Jquery多选框互相内容交换的实例代码
有需要的朋友可以参考一下
复制代码 代码如下:
<head runat="server">
<title>无标题页</title>
<script type="text/javascript" src="js/jqueryminjs"></script>
<script type="text/javascript">
$(document)ready(function(){
// 把选择项追加给对方
$(#add)click(function(){
var options=$(#select option:selected);
var remove=optionsremove();
removeappendTo("#select");
});
// 把所有项追加给对方
$(#addAll)click(function(){
var options=$(#select option);
var remove=optionsremove();
removeappendTo("#select");
});
// 把选择项退回给对方
$(#remove)click(function(){
var options=$(#select option:selected);
var remove=optionsremove();
removeappendTo("#select");
});
// 把全部项退回给对方
$(#removeAll)click(function(){
var options=$(#select option);
var remove=optionsremove();
removeappendTo("#select");
});
});
</script>
</head>
<body>
<form id="form" runat="server">
<div id="left">
<select multiple="multiple" id="select" style="width:px;height:px">
<option>选项</option>
<option>选项</option>
<option>选项</option>
<option>选项</option>
<option>选项</option>
</select>
</div>
<div>
<span id="add">选中项添加至右边>></span><br />
<span id="addAll">全部添加到右边>></span>
</div>
<div id="right">
<select multiple="multiple" id="select" style="width:px;height:px"></select>
</div>
<div>
<span id="remove"><<选中项还原至左边</span><br />
<span id="removeAll"><<全部还原至左边</span>
</div>
</form>
</body>
