js判断checkbox是否被选中

判断checkbox var n = $("input:checked").length; 
if(n==0){ 
alert("未选中！"); 
}else{ 
alert("选中！"); 
} 

判断checkbox选中个数
   $(":checkbox[@name=compare]").click(function(){
        var checked = this.checked;
        id.each(function(){
            this.checked = checked;
        });
        cm(checked);
    });

    id.click(function(){
        var i = 0;
        id.each(function(){
            this.checked && i++;
        })
        cm(i>1);
    });   
//判断是否选中的兼容代码
if($("#ch1").attr("checked")=="checked"||$("#ch1").attr("checked")==true){
  alert('已选中');
}else{
  alert('未选中');
}

css美化checkbox

.chk_1 { 
    display: none; 
} 

.chk_1 + label { 
    background-color: #FFF; 
    border: 1px solid #C1CACA; 
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05); 
    padding: 9px; 
    border-radius: 5px; 
    display: inline-block; 
    position: relative; 
    margin-right: 30px; 
} 
.chk_1 + label:active { 
    box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1); 
} 

.chk_1:checked + label { 
    background-color: #ECF2F7; 
    border: 1px solid #92A1AC; 
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05), inset 15px 10px -12px rgba(255, 255, 255, 0.1); 
    color: #243441; 
} 

.chk_1:checked + label:after { 
    content: '\2714' //勾选符号 
    position: absolute; 
    top: 0px; 
    left: 0px; 
    color: #758794; 
    width: 100%; 
    text-align: center; 
    font-size: 1.4em; 
    padding: 1px 0 0 0; 
    vertical-align: text-top; 
}