jQuery Tutorial Tutorials - jQuery :checked selector

The jQuery :checked selector is used to select all elements that are checked or selected.

jQuery :checked selector Syntax

$(':checked')

jQuery :checked selector Examples

How to check if a checkbox is checked?

To determine if a checkbox has been checked, you can use many methods.
jQuery prop('checked') vs. is(':checked') vs attr("checked") vs .checked

$('#ele').is(":checked")
$('#ele').prop('checked')
$('#ele').attr('checked') // Be careful,It used to return false or true And now it return undefined or "checked". The value won't change even if checkbox state is changed.
$('#ele')[0].checked
$('#ele').get(0).checked
// 

<input type="checkbox" value="apple" name="fruits"> apple
<input type="checkbox" checked=""  value="banana" name="fruits"> banana
<input type="radio" name="fruit" value="orange">orange
<input type="radio" name="fruit" value="lemon">lemon
<script>
$('input').each(callback);
$('input').change(callback);
function callback() {
    console.log('');
    if ($(this).is(":checked")) {
        console.warn("the "+$(this).val()+" checkbox is checked");
    }
    else {
        console.warn("the "+$(this).val()+" checkbox is not checked");
    }
    
    console.log($(this).val()+" .is(':checked') "+$(this).is(':checked'));
    console.log($(this).val()+" .prop('checked') "+$(this).prop('checked'));
    console.log($(this).val()+" .attr('checked') "+$(this).attr("checked"));
    console.log($(this).val()+" [0].checked "+$(this)[0].checked);
    console.log($(this).val()+" .get(0).checked "+$(this).get(0).checked);
}
</script>

Try it

In below example,We determine how many input checkbox are checked.

Try now