checked 超出勾选数量后 禁止操作

第一种方法：

html

<input type="checkbox" onClick="doCheck(this)" class="checkbox-a" name="personality[]" value="选项1">
<input type="checkbox" onClick="doCheck(this)" class="checkbox-a" name="personality[]" value="选项2">
<input type="checkbox" onClick="doCheck(this)" class="checkbox-a" name="personality[]" value="选项3">
<input type="checkbox" onClick="doCheck(this)" class="checkbox-a" name="personality[]" value="选项4">
<input type="checkbox" onClick="doCheck(this)" class="checkbox-a" name="personality[]" value="选项5">

jq

 var c=0,limit=10;
    function doCheck(obj) {
        obj.checked?c++:c--;
        if(c>limit){
            obj.checked=false;
            console.log("已选择10个标签！");
            c--;
        }
    }

第二种方法：

html

<div class="personality-checkbox">
    <input type="checkbox" class="checkbox-a" name="personality[]" value="选项1">
    <input type="checkbox" class="checkbox-a" name="personality[]" value="选项2">
    <input type="checkbox" class="checkbox-a" name="personality[]" value="选项3">
    <input type="checkbox" class="checkbox-a" name="personality[]" value="选项4">
    <input type="checkbox" class="checkbox-a" name="personality[]" value="选项5">
</div>

jq

//点击后检测执行
$('.personality-checkbox .checkbox-a').click(function () {
    if($('.personality-checkbox .checkbox-a:checked').length>=10){
        $(".personality-checkbox .checkbox-a:not(:checked)").attr('disabled','disabled');
    }else {
        $(".personality-checkbox .checkbox-a:not(:checked)").attr('disabled',false);
        console.log()
    }
});

//刷新页面自动执行
$(function () {
    $(".personality-checkbox .checkbox-a:not(:checked)").attr('disabled','disabled');
});