Today, We want to share with you how to get checked and unchecked checkbox value in jquery?.In this post we will show you jquery get checkbox value if checked, hear for how to get checked and unchecked checkbox value in javascript we will give you demo and example for implement.In this post, we will learn about Laravel Check And Uncheck All Checkbox Using Jquery with an example.
How to check a checkbox is checked or not using jQuery?
Example 1: index.html (Using the jQuery prop() Method)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Check the Status of Checkboxes - www.pakainfo.com</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
$('input[type="checkbox"]').click(function(){
if($(this).prop("checked") == true){
$("#output").html("Checkbox is checked.");
}
else if($(this).prop("checked") == false){
$("#output").html("Checkbox is unchecked.");
}
});
});
</script>
</head>
<body>
<p><input type="checkbox"> Check or uncheck the checkbox to get the status.</p>
<div id="output" style="background: yellow;"></div>
</body>
</html>
Using the jQuery :checked Selector
Example 2:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Check the Status of Checkboxes - www.pakainfo.com</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
$('input[type="checkbox"]').click(function(){
if($(this).is(":checked")){
$("#output").html("Your Checkbox is checked.");
}
else if($(this).is(":not(:checked)")){
$("#output").html("Your Checkbox is unchecked.");
}
});
});
</script>
</head>
<body>
<p><input type="checkbox"> Check or uncheck the checkbox to get the status.</p>
<div id="output" style="background: yellow;"></div>
</body>
</html>
I hope you get an idea about checkbox check uncheck event javascript.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.