jQuery's syntax is designed to make it easier to navigate a document, select DOM elements, create animations, handle events, and develop AJAX applications. It provides a set of utility function and selectors for easy access to basic functionality. For checking current status of a checkbox, we have two ways.
- prop() method: It provides a simple, effective, and reliable way to track down the current status of a checkbox.
- :checked selector: It specifically designed for radio button and checkboxes. We just need to add this selector with checkbox element.
The following example will explain about jQuery's prop method and :checked selector for HTML checkbox status. You can easily copy it and use with your own code.
<script>
$(document).ready(function(){
$('input[type="checkbox"]').click(function(){
if($(this).prop("checked") == true){
console.log("Checkbox - Checked");
}
else if($(this).prop("checked") == false){
console.log("Checkbox - Unchecked");
}
});
});
</script>
Supported Browsers:
- Internet Explorer
- Mozilla Firefox
- Google Chrome
- Opera
- Safari
jQuery is a javascript library language used to perform the action on DOM elements of HTML webpages. You can learn jquery from our Jquery Tutorials and Jquery Examples