码迷,mamicode.com
首页 > 其他好文 > 详细

全选反选

时间:2016-07-12 19:06:58      阅读:120      评论:0      收藏:0      [点我收藏+]

标签:

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="list">
<ul class="mui-table-view textOverflow" id="notesList" >
<li><input type="checkbox" class="check" name="notices" value="1"> 篮球</li>
<li><input type="checkbox" class="check" name="notices" value="1"> 足球</li>
<li><input type="checkbox" class="check" name="notices" value="1"> 乒乓球</li>
<li><input type="checkbox" class="check" name="notices" value="1"> 羽毛球</li>
<li><input type="checkbox" class="check" name="notices" value="1"> 排球</li>
</ul>
</div>
<input type="checkbox" value="全选" class="btn" id="selectAll">全选
</body>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
<script>
$("#selectAll").off().on(‘click‘,function(){
var $that = $(this),
$myLi = $("ul li");
$myLi.each(function(index){
var check = $myLi.find(".check");
if($that.is(‘:checked‘)){
check.prop(‘checked‘,true);
}else{
check.prop(‘checked‘,false);
}
check.click(function(){
if($(this).is(":checked")){

}
else{
$that.prop(‘checked‘,false);
}
})
})
})

</script>
</html>

全选反选

标签:

原文地址:http://www.cnblogs.com/ZH1132672711/p/5664256.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!