In this tutorial, you will learn that –
how to detect a checkbox changes and the checkbox have been checked or not.
Examples
First example:
In the first example, to check that the checkbox is checked or not, we will use the Jquery is() function.
Through the jquery is() method we will check whether the “:checked” selector is in the checkbox or not.
The :checked
selector works for checkboxes, radio buttons, and options of select
elements.
<input type="checkbox" class="checkbox">
<script>
$(function(){
$('.checkbox').change(function(){
if($(this).is(":checked") === true){
alert('Checkbox is checked');
}
else{
alert('Checkbox is not checked');
}
});
});
</script>
Second example:
In the second example, we will use the Jquery prop() method to check that the checkbox is checked or not.
<input type="checkbox" class="checkbox">
<script>
$(function(){
$('.checkbox').change(function(){
if($(this).prop("checked") === true){
alert('Checkbox is checked');
}
else{
alert('Checkbox is not checked');
}
});
});
</script>
Learn also: