<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>selectAll</title>
<style type="text/css">
table {
border: 1px solid red;
border-collapse:collapse;
width:300px;
margin :auto;
text-align:center;
}
</style>
<script src="js/jquery-1.7.1.js"></script>
<script type="text/javascript">
$(function () {
$(".all").click(function () {
if ($(".all").attr("checked")) {//全选
$(".cc").attr("checked", true);
}
else {//取消全选
$(".cc").removeAttr("checked");
}
})
$(".cc").click(function () {
SelectAll();
})
})
function SelectAll() {
if (!$(".cc").attr("checked")) {//未选中
$(".all").attr("checked",false)
}
else {//全部选中
$(".all").attr("checked", true)
}
}
</script>
</head>
<body>
<table id="tb" border="1">
<tr>
<td>序列</td>
</tr>
<tr>
<td>
<input type="checkbox" class="cc"/></td> </tr>
<tr>
<td><input type="checkbox" class="cc"/></td>
</tr>
<tr>
<td><input type="checkbox" class="cc"/></td>
</tr>
<tr>
<td><input type="checkbox" class="cc"/></td>
</tr>
<tr>
<td><input type="checkbox" class="all" />all</td>
</tr>
</table>
</body>
</html>
