<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="https://lib.sinaapp.com/js/jquery/2.0.2/jquery-2.0.2.min.js"></script>
</head>
<style>
</style>
<body>
<!-- 头部全选 -->
<div class="cart">
<div class="t-checkbox">
<input type="checkbox" class="checkall">全选
</div>
</div>
<!-- 商品详细模块 -->
<div class="cart-item-list">
<div class="cart-item check-cart-item">
<div class="p-checkbox">
<input type="checkbox" checked="checked" class="j-checkbox">
</div>
</div>
<div class="cart-item check-cart-item">
<div class="p-checkbox">
<input type="checkbox" class="j-checkbox">
</div>
</div>
<div class="cart-item check-cart-item">
<div class="p-checkbox">
<input type="checkbox" class="j-checkbox">
</div>
</div>
</div>
<!-- 结算模块 -->
<div class="cart-floatbar">
<div class="select-all">
<input type="checkbox" class="checkall">全选
</div>
</div>
<script type="text/javascript">
$(function(){
//1.全选 全不选功能
//就是把全选按钮 checkall 的状态赋值给 三个小按钮 j-checkbox 就可以了
//事件可以使用change
$(".checkall").change(function(){
//console.log($(this).prop("chacked"));
$(".j-checkbox, .checkall").prop("checked",$(this).prop("checked"));
})
// 2.如果小复选框被选中的个数等于3 就应该把全部按钮都选上,兜着全部按钮不选
$(".j-checkbox").change(function(){
if($(".j-checkbox:checked").length===$(".j-checkbox").length){
$(".checkall").prop("checked",true);
}else{
$(".checkall").prop("checked",false);
}
})
})
</script>
</body>
</html>
浙公网安备 33010602011771号