$(function () {
//全选不选功能模块
$(".checkall").change(function () {
//console.log($(this).prop("checked"));
//让俩个全选按钮同时生效，当点击checlall时候，$(this).prop("checked")为true
$(".j-checkbox, .checkall").prop("checked", $(this).prop("checked"));
})
//点击所有单独按钮，实现俩个全选按钮为true
$(".j-checkbox").change(function () {
//console.log($(".j-checkbox:checked"));
//设置选择复选框按钮等于所有按钮的长度
if ($(".j-checkbox:checked").length === $(".j-checkbox").length) {
$(".checkall").prop("checked", true);
} else {
$(".checkall").prop("checked", false);
}
})
})
<!DOCTYPE html>
<html lang="en">
<head>
<title>全选全不选</title>
<script src="js/jquery.min.js"></script>
<script src="js/test.js"></script>
<style>
.tab {
width: 600px;
height: 330px;
text-align: center;
margin-left: auto;
margin-right: auto;
}
</style>
</head>
<body>
<table class="tab" border="1">
<tr>
<th width="70px">
<input type="checkbox" name="" id="" class="checkall"> 全选
</th>
<th>
商品
</th>
<th>
价格
</th>
</tr>
<tr>
<td>
<input type="checkbox" name="" id="" class="checkbox">
</td>
<td>
商品
</td>
<td>
价格
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="" id="" class="checkbox">
</td>
<td>
商品
</td>
<td>
价格
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="" id="" class="checkbox">
</td>
<td>
商品
</td>
<td>
价格
</td>
</tr>
<tr>
<td>
<b><input type="checkbox" name="" id="" class="checkall"> 全选</b>
</td>
<td>
<a href="#">删除选中的商品</a>
</td>
<td>
<a href="#">结算模块</a>
</td>
</tr>
</table>
</body>
</html>