jquery checbox全选和取消全选

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
// 表格的隔行换色
$(function () {
$("tbody tr:odd").addClass("odd");
$("tbody tr:even").addClass("even");
});
</script>
</head>
<body>
<table id="tab1" border="1" width="80%" align="center">
<thead>
<tr>
<th>
<input type="checkbox" id="selectAll" />
</th>
<th>
分类的ID
</th>
<th>
分类的名称
</th>
<th>
分类的描述
</th>
<th>
操作
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<input type="checkbox" name="ids" />
</td>
<td>
1
</td>
<td>
手机数码
</td>
<td>
手机数码
</td>
<td>
<a href="">修改</a>|<a href="">删除</a>
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="ids" />
</td>
<td>
2
</td>
<td>
电脑办公
</td>
<td>
电脑办公
</td>
<td>
<a href="">修改</a>|<a href="">删除</a>
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="ids" />
</td>
<td>
3
</td>
<td>
烟酒糖茶
</td>
<td>
烟酒糖茶
</td>
<td>
<a href="">修改</a>|<a href="">删除</a>
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="ids" />
</td>
<td>
4
</td>
<td>
鞋靴箱包
</td>
<td>
鞋靴箱包
</td>
<td>
<a href="">修改</a>|<a href="">删除</a>
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="ids" />
</td>
<td>
5
</td>
<td>
汽车用品
</td>
<td>
汽车用品
</td>
<td>
<a href="">修改</a>|<a href="">删除</a>
</td>
</tr>
</tbody>
</table>
</body>
</html>
<script type="text/javascript">
// 复选框的全选和全不选
// $(function () {
// // 获得上面的复选框
// var $selectAll = $("#selectAll");
// $selectAll.click(function () {
// if ($selectAll.attr("checked") == true) {
// $(":checkbox[name='ids']").attr("checked", true);
// } else {
// // 上面的复选框没被选中
// $(":checkbox[name='ids']").attr("checked", false);
// }
// });
// });

$(function () {
var all = $("#selectAll");
all.click(function () {
if (all.attr("checked") == true) {
$(":checkbox[name='ids']").attr("checked", true);
}
else {
$(":checkbox[name='ids']").attr("checked", false);
}
})
})
</script>
<%--<script type="text/javascript">
// 复选框的全选和全不选
$(function () {
$("#selectAll").click(function () {
$(":checkbox[name='ids']").attr("checked", this.checked); // this指代的你当前选择的这个元素的JS对象
});
});
</script>--%>

原文地址:https://www.cnblogs.com/wugh8726254/p/13097478.html