<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<ul id="list">
<li><input type="checkbox" id="all_checked" value="1"></li>
<li><label><input type="checkbox" name="test" value="1"> 1.时间都去哪儿了</label></li>
<li><label><input type="checkbox" name="test" value="2"> 2.海阔天空</label></li>
<li><label><input type="checkbox" name="test" value="3"> 3.真的爱你</label></li>
<li><label><input type="checkbox" name="test" value="4"> 4.不再犹豫</label></li>
<li><label><input type="checkbox" name="test" value="5"> 5.光辉岁月</label></li>
<li><label><input type="checkbox" name="test" value="6"> 6.喜欢妳</label></li>
</ul>
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
//全选全不选 绑定行内 checkbox 点击事件
//全选/全不选【可以绑上事件】
$("#all_checked").click(function() {
$('[name=test]:checkbox').prop('checked', this.checked); //checked为true时为默认显示的状态
});
$('[name=test]:checkbox').click(function() {
var n = $('[name=test]:checkbox').length;
var m = $('[name=test]:checked').length;
if(n == m) {
$("#all_checked").prop("checked", "checked")
} else {
$("#all_checked").prop("checked", "");
}
})
</script>
</body>
</html>最简单 的全选 全不选
猜你喜欢
转载自blog.csdn.net/qiuyan_f/article/details/79219208
今日推荐
周排行