jquery check if checkbox is checked – Best 5 Examples

jquery check if checkbox is checked : prop() and is() method are the best 2 way Use the jQuery prop() method & :checked selector : Question – How to check a checkbox is checked or not using jQuery?

jquery if checkbox checked

$( "YOUR_SELECTOR" ).attr( "checked" )  // if present on the element => true, if not present => undefined 
$( "YOUR_SELECTOR" ).prop( "checked" ) // if checked => true,  if unchecked => false.
$( "YOUR_SELECTOR" ).is( ":checked" ) // if checked => true,  if unchecked => false.

jquery check if checkbox is checked

$('#Your_selectore').prop('checked'); // Boolean true

Using the jQuery prop() Method
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Check If A Checkbox Is Checked With jQuery - 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){
                $("#display_output").html("Your Item is checked.");
            }
            else if($(this).prop("checked") == false){
                $("#display_output").html("Your Item is unchecked.");
            }
        });
    });
</script>
</head>
<body>
	<p><input type="checkbox"> check whether a checkbox is checked in jQuery Example.</p>
    <div id="display_output" style="background: green;"></div>
</body>
</html>

Using the jQuery :checked Selector

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Check If A Checkbox Is Checked With jQuery - 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")){
                $("#display_output").html("Your Item is checked.");
            }
            else if($(this).is(":not(:checked)")){
                $("#display_output").html("Your Item is unchecked.");
            }
        });
    });
</script>
</head>
<body>
    <p><input type="checkbox"> check whether a checkbox is checked in jQuery Example.</p>
    <div id="display_output" style="background: green;"></div>
</body>
</html>

uses the length() and size() methods:

$('#checkbox1:checked').length; // Integer >0
$('#checkbox1:checked').size(); // .size() can be used instead of .length

Example

<!DOCTYPE html>
<html>
  <head>
    <title>How to Test If a Checkbox is Checked with jQuery - www.pakainfo.com</title>
    <script src="https://code.jquery.com/jquery-3.5.0.min.js"></script>
  </head>
  <body>
    <div id="checkList">
      <input id="product1" type="checkbox" name="mobile" value="1" />
      <input id="product2" type="checkbox" name="laptop" value="2" />
      <input id="product3" type="checkbox" name="dvd" value="3" />
    </div>
    <input type="button" id="btnCheck" value="Check" />
    <script type="text/javascript">
      $(function() {
        $("#btnCheck").click(function() {
            let checked = $("#checkList input[type=checkbox]:checked")
              .length;
            if(checked > 0) {
              alert(checked + " Product(s) are checked.");
              return true;
            } else {
              alert("Please select Product(s).");
              return false;
            }
          });
      });
    </script>
  </body>
</html>

check if checkbox is checked jquery

using plane javascript

if(document.getElementById('checkListId').checked) {
    //Your Logic
} 

using jQuery

if($('#checkListId').is(':checked')){
    //Your Logic
}

jquery checkbox checked value

if ($('#check_id').is(":checked"))
{
  //Your Logic
}

jquery check if checkbox is not checked

if (!$("#checkboxID").is(":checked")) {
    // Your Logic
}

jquery checkbox checked

$("checkbox").is(":checked")

check if checkbox is checked jquery

var $boxes = $('input[name=checkboxname]:checked');

I hope you get an idea about jquery check if checkbox is checked.
I would like to have feedback on my infinityknow.com.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.