JQuery: How to check if Checkbox is Checked or Unchecked [Validate checkbox]

jQuery check if the checkbox is checked or unchecked: This article explains how to checkbox a checkbox is checked not in jQuery. In other words, how to test the state of the checkbox i.e. whether the checkbox is checked or unchecked in jQuery.  

Here we use the jQuery .is() method and matched checked attribute.

Description: The method .is() Check the current matched set of elements against a selector, element, or jQuery object and return true if at least one of these elements matches the given arguments.

Steps to Check if Checkbox is Checked in jQuery

1. Add HTML markup, i.e checkbox, button tag
2. jQuery code to check if a checkbox is checked by id using .is() method

# Add HTML markup

Here first we add a checkbox input type, having id as chkFollow, and a button tag. On the button click will write the jQuery code to verify whether the checkbox is checked or unchecked 

Our HTML looks like as shown below:

<input type="checkbox" id="chkFollow">Follow Me
<button id="btnCheckStatus">Get Checkbox Status</button> 

# jQuery Code check if a checkbox is checked, using .is() method 

Here first, we stored the checkbox control in a variable i.e chkItem, which we use inside the button clicks event. Basically assigning a variable to the control (selector) is good practice for performance-wise, i.e. caching the control.

Now on button click, we use the jQuery is() method with the :checked selector, which returns the boolean value. As a result, we got to know the checkbox current status,  checked or unchecked in jQuery.

var chkItem=$("#chkFollow");
$("#btnCheckStatus").on('click',function(){
    if($(chkItem).is(":checked"))
    {
        console.log("Yes you are following ");
    }
    else{console.log("No you are not following");}
});

View Demo

Conclusion: Here in this article we understand the usage of jQuery is() method with :checked selector to find if the checkbox is checked on not.

Other  Resource:

• jQuery :checked selector