Image

How to check whether a checkbox is checked in jQuery?

Methods are available to find if checkbox is checked or not.

  • 1.is() Method
  • 2.jQuery prop() Method

Lets take a look of each method/selector


1. is() Method

is(): This method is also very simple and easy to use. By using this we can easily find whether a checked box is checked or not.

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script> 
    $(document).ready(function() { 
        $("#customBtn").click(function() { 
            if ($("input[type=checkbox]").is(":checked")) { 
                alert("Check box in Checked"); 
            } else { 
                alert("Check box is Unchecked"); 
            } 
        }); 
    }); 
</script>
</head>
<body>

Gender:<input type="checkbox" name="gender" value="Male"/>

<button id="customBtn">Click here.</button>

</body>
</html>

 

2.jQuery prop() Method
The jQuery prop() method return true or false if checkbox is checked or not.

<script> 
    $(document).ready(function() { 
        $("#customBtn").click(function() { 
            if ($("input[type=checkbox]").prop("checked")){
                alert("Check box in Checked"); 
            } else { 
                alert("Check box is Unchecked"); 
            } 
        }); 
    }); 
</script>

 

Categories: Java Script Tags: #JQuery, #ES6, #JavaScript,

Newsletter Subcribe

Receive updates and latest news direct from our team. Simply enter your email.