限制复选框，但仅限新选中的复选框

Question

I have a bit of jquery that lets me limit the number of checkboxes a user can check on a page:

 $('input[type=checkbox]').on('change', function (e) {
    if ($('input[type=checkbox]:checked').length > 3) {
        $(this).prop('checked', false);
        alert("allowed only 3");
    }
});

But, the user is limited to 'x' number once per day. So they come to the form, submit their limit (3 checked). They come back next day, I have the 3 checked that were from yesterday but set to disabled:

 checked="checked" disabled="disabled" disabled/>

Is there a way to modify my if statement to say "input[type=checkbox]:checked" but not if disabled or not if class="disabled" so these don't count against the daily limit?

Answer 1

You can use jQuery not() method for that like following.

$('input[type=checkbox]').on('change', function (e) {
    if ($('input[type=checkbox]:checked').not(':disabled').length > 3) {
        $(this).prop('checked', false);
        alert("allowed only 3");
    }
});

Answer 2

You can use :enabled

$('input[type=checkbox]').on('change', function (e) {
    if ($('input[type=checkbox]:enabled:checked').length > 3) {
        $(this).prop('checked', false);
        alert("allowed only 3");
    }
});