jquery select多選框的左右移動具體實現代碼

這篇文章介紹了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>

From:http://tw.wingwit.com/Article/program/Java/JSP/201311/20346.html

jquery select多選框的左右移動 具體實現代碼

jquery select多選框的左右移動具體實現代碼