两个Listbox或者DropdownList进行添加 移除 排序的例子
直接上代码,拷贝直接运行即可:
ASPX 代码
<%@ Page Language="C#" EnableEventValidation="false" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected void Button1_Click(object sender, EventArgs e)
{
Response.Write("<li>s1 = " + Request.Form[s1.UniqueID]);
Response.Write("<li>s2 = " + Request.Form[s2.UniqueID]);
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
var bak = null;
function setData() {
ss1 = document.getElementById("<%=s1.ClientID %>");
ss2 = document.getElementById("<%=s2.ClientID %>");
if (bak == null) {
bak = [];
for (i = 0; i < ss1.length; i++) bak.push(ss1[i].value);
}
for (i = ss1.length - 1; i > -1; i--) {
if (ss1[i].selected) {
ss2.options[ss2.options.length] = new Option(ss1[i].value, ss1[i].value);
ss1[i].parentNode.removeChild(ss1[i]);
}
}
SortSelect(ss1);
SortSelect(ss2);
}
function removeData() {
ss1 = document.getElementById("<%=s1.ClientID %>");
ss2 = document.getElementById("<%=s2.ClientID %>");
for (i = ss2.length - 1; i > -1; i--) {
if (ss2[i].selected) {
ss1.options[ss1.options.length] = new Option(ss2[i].value, ss2[i].value);
ss2[i].parentNode.removeChild(ss2[i]);
}
}
SortSelect(ss1);
SortSelect(ss2);
}
function SortSelect(ss) {
var tt = [];
for (i = 0; i < bak.length; i++) {
for (j = 0; j < ss.length; j++) {
if (ss[j].value == bak[i]) tt.push(bak[i]);
}
}
ss.length = 0;
for (i = 0; i < tt.length; i++) {
ss.options[ss.options.length] = new Option(tt[i], tt[i]);
}
}
</script>
</head>
<body>
<form runat="server" id="form1">
<table>
<tr>
<td>
<asp:ListBox ID="s1" runat="server" SelectionMode="Multiple" Rows="6">
<asp:ListItem>A</asp:ListItem>
<asp:ListItem>B</asp:ListItem>
<asp:ListItem>C</asp:ListItem>
<asp:ListItem>D</asp:ListItem>
</asp:ListBox>
</td>
<td>
<input onclick="setData()" type="button" value="->"/>
<br />
<input onclick="removeData()" type="button" value="<-" />
</td>
<td>
<asp:ListBox ID="s2" runat="server" SelectionMode="Multiple" Rows="6"></asp:ListBox>
</td>
</tr>
</table>
<asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="得到选中的" />
</form>
</body>
</html>
补充:Web开发 , ASP.Net ,