基于复选框demo(分享)
基于复选框demo(分享)
本篇文章是关于复选框的,有2种形式:1、全选、反选由2个按钮实现;2、全选、反选由一个按钮实现。
body{ text-align:center}
.con{ margin:100px auto; width:800px; height:400px; border:1px solid #F00; padding-top: 50px;}
</style>
全选
反选
苹果
香蕉
梨子
桃子
西瓜
全选
老子
尚书
周易
诗经
孟子
中庸
//全选
function allSelect(){
$("input[name='fruit']").prop("checked", "checked");
$("input[name='cancel']").removeAttr("checked");
}
//反选
function unAllSelect(){
$("input[name='fruit']").removeAttr("checked");
$("input[name='select']").removeAttr("checked");
}
//单选
$("#allBook").click(function(){
if(this.checked){
// $("input[name='book']").attr("checked", true);
$("input[name='book']").prop("checked", "checked");
}else{
// $hypmEgv("input[name='book']").attr("checked", false);
$("input[name='book']").removeAttr("checked");
}
});