The following section describes how to track the status of checkboxes whether it is checked or not using the jQuery prop() method as well as the :checked selector.
Using the jQuery prop() Method
The jQuery prop() method provides a simple, effective, and reliable way to track down the current status of a checkbox. It works pretty well in all conditions because every checkbox has a checked property which specifies its checked or unchecked status.
Do not misunderstand it with the checked attribute. The checked attribute only define the initial state of a checkbox, and not the current state. Let's see how it works:
You can also use the jQuery :checked selector to check the status of checkboxes. The :checked selector specifically designed for radio button and checkboxes.
Let's take a look at the following example to understand how it basically works:
<script>
$(document).ready(function(){
$('input[type="checkbox"]').click(function(){
if($(this).is(":checked")){
console.log("Checkbox is checked.");
}
else if($(this).is(":not(:checked)")){
console.log("Checkbox is unchecked.");
}
});
});
</script>
Use the jQuery
prop()
method &:checked
selectorThe following section describes how to track the status of checkboxes whether it is checked or not using the jQuery
prop()
method as well as the:checked
selector.Using the jQuery
prop()
MethodThe jQuery
prop()
method provides a simple, effective, and reliable way to track down the current status of a checkbox. It works pretty well in all conditions because every checkbox has a checked property which specifies its checked or unchecked status.Do not misunderstand it with the
checked
attribute. Thechecked
attribute only define the initial state of a checkbox, and not the current state. Let's see how it works:Using the jQuery
:checked
SelectorYou can also use the jQuery
:checked
selector to check the status of checkboxes. The:checked
selector specifically designed for radio button and checkboxes.Let's take a look at the following example to understand how it basically works:
need an explanation for this answer? contact us directly to get an explanation for this answer