这篇文章介绍了jquery实现select多选框的左右移动的方法
有需要的朋友可以参考一下
复制代码 代码如下:
<!DOCTYPE html PUBLIC "//WC//DTD XHTML Transitional//EN" "
<html xmlns="
<head>
<meta httpequiv="ContentType" content="text/html; charset=gb" />
<title>无标题文档</title>
<script type="text/javascript" src="jqueryminjs"></script>
<script type="text/javascript">
/**
*动态的给左边的下拉列表创建选项
*具体情况可以从数据库读取数据动态创建选项
*/
$(document)ready(function(){
for(var i=;i<=;i++)
{
$("#fb_list")append("<option value="+i+">公开招标小型机采购"+i+"</option>");
}
})
$(function(){
$("#add")click(function(){
if($("#fb_list option:selected")length>)
{
$("#fb_list option:selected")each(function(){
$("#select_list")append("<option value="+$(this)val()+">"+$(this)text()+"</option");
$(this)remove();
})
}
else
{
alert("请选择要添加的分包！");
}
})
})
$(function(){
$("#delete")click(function(){
if($("#select_list option:selected")length>)
{
$("#select_list option:selected")each(function(){
$("#fb_list")append("<option value="+$(this)val()+">"+$(this)text()+"</option");
$(this)remove();
})
}
else
{
alert("请选择要删除的分包！");
}
})
})
</script>
</head>
<body>
<table width="%" cellpadding="" align="center" class="listshow" border="" cellspacing="">
<tr>
<td colspan="" align="center">选择分包</td>
</tr>
<tr>
<td class="black" width="%" align="center" height="">
<select id="fb_list" multiple="multiple"style="textalign:center;width:px;height:px;"></select>
</td>
<td align="center" width="%">
<input type="button" id="add" value="添加>>" />
<br/>
<br/>
<input type="button" id="delete" value="<<删除" />
</td>
<td class="black" width="%" align="center">
<select id="select_list" multiple="multiple" style=" textalign:center;width:px;height:px;"></select>
</td>
</tr>
</table>
</body>
</html>
