jquery控制listbox中项的移动并排序_jquery

首先是html代码，页面上放2个listbox控件和2个按钮用于移动项目 复制代码 代码如下: 全部水果： 我挑选的： >>" onclick="move('listall','listmy');"/> 下面是在.cs文件中绑定一些数据 复制代码 代码如下: public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { BindData(); } } private void BindData() { ArrayList list=DataArray(); for (int i = 0; i { listall.Items.Add(list[i].ToString()); listall.Items[i].Attributes["tag"] = i.ToString(); //用tag记录排序字段 } } private ArrayList DataArray() { //用到的一些数据，这里已默认按第一个字的拼音排序 ArrayList list = new ArrayList(); list.Add("草莓"); list.Add("梨"); list.Add("桔子"); list.Add("芒果"); list.Add("苹果"); list.Add("香蕉"); return list; } } 在实际使用时可根据数据库中的字段排序 下面是jquery的代码： 复制代码 代码如下: //移动用户选择的角色 //setname:要移出数据的列表名称 getname:要移入数据的列表名称 function move(setname,getname) { var size=$("#"+setname+" option").size(); var selsize=$("#"+setname+" option:selected").size(); if(size>0&&selsize>0) { $.each($("#"+setname+" option:selected"), function(id,own){ var text=$(own).text(); var tag=$(own).attr("tag"); $("#"+getname).prepend(""+text+""); $(own).remove(); $("#"+setname+"").children("option:first").attr("selected",true); }); } //重新排序 $.each($("#"+getname+" option"), function(id,own){ orderrole(getname); }); } //按首字母排序角色列表 function orderrole(listname) { var size=$("#"+listname+" option").size(); var one=$("#"+listname+" option:first-child"); if(size>0) { var text=$(one).text(); var tag=parseInt($(one).attr("tag")); //循环列表中第一项值下所有元素 $.each($(one).nextAll(), function(id,own){ var nextag=parseInt($(own).attr("tag")); if(tag>nextag) { $(one).remove(); $(own).after(""+text+""); one=$(own).next(); } }); } } 这样就完成了简单的js控制两个列表项的值移动。