DEV Community

Avnish Jayaswal
Avnish Jayaswal

Posted on

How to check a checkbox is checked or not using jQuery

Answer: Use the jQuery prop() method

To check whether checkboxes are checked or not using the jQuery prop() method as well as the :checked selector.

Example

The jQuery prop() method provides an effective way to track down the current status of a checkbox.

<script>
    $(document).ready(function(){
        $('input[type="checkbox"]').click(function(){
            if($(this).prop("checked") == true){
                console.log("Checkbox is checked.");
            }
            else if($(this).prop("checked") == false){
                console.log("Checkbox is unchecked.");
            }
        });
    });
</script>
Enter fullscreen mode Exit fullscreen mode

Using the jQuery :checked Selector

<script>
    $(document).ready(function(){
        $('input[type="checkbox"]').click(function(){
            if($(this).is(":checked")){
                console.log("Checkbox is checked.");
            }
            else if($(this).is(":not(:checked)")){
                console.log("Checkbox is unchecked.");
            }
        });
    });
</script>

Enter fullscreen mode Exit fullscreen mode

Using the jQuery is() Method :


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

Read More: How to check a checkbox is checked or not using jQuery

Top comments (0)