本文介绍如何使用jQuery实现复选框全选功能，并获取选中的复选框值，适用于HTML与服务器控件。
复选框的全选以前也做过，这次写遇到的问题还不少，还是总结一下吧。
首先要引用jquery包，注意这里不要加language="javascript" ，加上是错误的，调试半天才找到原因，加上后出现语法错误
<script src="../Scripts/jquery-1.7.2.js" type="text/javascript"></script>
<script type="text/javascript" language="javascript" >
//设置全选与反选
$(function() {
//html控件写法，没有runat="server"
$("#iteamAll").click(function() {
$("input[name=cb_Item]").attr("checked", this.checked);
});
//服务器控件写法，有runat="server"
$("#iteamAll").click(function() {
if ($(this).attr("checked"))
$("#gvMoniProject input[type=checkbox]").attr("checked", true);
else
$("#gvMoniProject input[type=checkbox]").attr("checked", false);
});
//设置默认选中的值
var defValue = $("input[id*=hdDefIDS]").val().split(/[,，]/g);
$.each(defValue, function(index, item) {
$("input[name='cb_Item']").each(function() {
if ($(this).val() == item) {
$(this).attr("checked", true);
}
});
});
});
//获取选中checkbox的值
function GetSelValue() {
var array1 = $("input[type=checkbox]:checked");
var array2 = [];
$.each(array1, function(key1, item1) {
array2[key1] = $(this).val();
});
$("#hdIDS").val(array2.toString());
}
</script>
<body>
<form id="form1" runat="server">
<input id="hdIDS" name="hdIDS" type="hidden" />
<div>
<asp:GridView ID="gvMoniProject" runat="server" AutoGenerateColumns="False" CellPadding="4"
ForeColor="#333333" GridLines="None">
<RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
<Columns>
<asp:BoundField DataField="ItemCode" HeaderText="代码" />
<asp:BoundField DataField="ItemName" HeaderText="名称" />
<asp:TemplateField>
<ItemTemplate>
<%-- <asp:CheckBox name="cb_Item" runat="server" />--%>
<input name="cb_Item" type="checkbox" value='<%# Eval("ID") %>' />
</ItemTemplate>
<HeaderTemplate>
<input type="checkbox" id="iteamAll" />显示
</HeaderTemplate>
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
<SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
<HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<EditRowStyle BackColor="#999999" />
<AlternatingRowStyle BackColor="White" ForeColor="#284775" />
</asp:GridView>
</div>
</form>
</body>
这里需要注意的是，给某一个控件添加事件时，是根据控件的id添加的，取控件的值时，是根据name获取的，个人深有体会。
在这里，我是用的html控件，把选中的checkbox的值赋给隐藏域，在后台进行处理的
后台获取方法： string ids = Request.Form["hdIDS"];
希望对需要的人有所帮助！
扫一扫
538
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
