jQuery实现全选&全不选&非全选
更新时间:2017年03月23日 15:08:42 作者:wizx1992
本文主要介绍了jQuery实现全选&全不选&非全选,具有很好的参考价值,下面跟着小编一起来看下吧
1.点击全选 选中/取消所有复选框
2.取消某一个复选框,全选按钮不选中
3.勾选所有复选框后,全选按钮选中
<div>
<div><input type="checkbox" name="checkbox" />复选框1</div>
<div><input type="checkbox" name="checkbox" />复选框2</div>
<div><input type="checkbox" name="checkbox" />复选框3</div>
<div><input type="checkbox" name="checkbox" />复选框4</div>
<div><input type="checkbox" name="checkbox" />复选框5</div>
<br>
<div><input type="checkbox" name="checkall" />全选</div>
</div> $('input[name="checkall"]').click(function(){
if($(this).is(':checked')){
$('input[name="checkbox"]').each(function(){
$(this).prop("checked",true);
});
}else{
$('input[name="checkbox"]').each(function(){
$(this).prop("checked",false);
});
}
});
// 全选
$('input[name="checkall"]').click(function(){
if($(this).is(':checked')){
$('input:checkbox[name=checkbox]').each(function(){
$(this).prop("checked",true);
})
}else{
$('input:checkbox[name=checkbox]').each(function(){
$(this).prop("checked",false);
})
}
})
var ifAllChecked = true;
// 是否全选-----是否选中全选按钮
$('input:checkbox[name=checkbox]').click(function(){
ifAllChecked = true
$('input:checkbox[name=checkbox]').each(function(i){
if(!$(this).is(':checked')){
// 有未选
ifAllChecked = false;
}
});
if(ifAllChecked){
$('input[name="checkall"]').prop("checked",true);
}else{
$('input[name="checkall"]').prop("checked",false);
}
})相关文章
jquery fancybox ie6不显示关闭按钮的解决办法
本篇文章主要是对jquery fancybox ie6不显示关闭按钮的解决办法进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助2013-12-12
jquery分页插件jquery.pagination.js实现无刷新分页
这篇文章主要介绍了jquery分页插件jquery.pagination.js实现无刷新分页的相关资料,需要的朋友可以参考下2016-04-04


最新评论