:checked
selectorThe jQuery :checked
selector is used to select all elements that are checked or selected.
:checked
selector Syntax$(':checked')
:checked
selector ExamplesTo 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>
In below example,We determine how many input checkbox are checked.