Search code snippets, questions, articles... Chrome Extension

Check whether a checkbox is checked or not using Javascript only

You can use the .checked property of the input element using javascript to check whether a checkbox is checked or not.
var checkbox = document.getElementById("checkbox_id");

if (checkbox.checked) {
    console.log("Checkbox is checked");
} else {
    console.log("Checkbox is not checked");
}
Best JSON Validator, JSON Tree Viewer, JSON Beautifier at same place. Check how cool is the tool

In the code snippet, we have a checkbox which has id checkbox_id. We are getting this checkbox using document.getElementById("checkbox_id").

We are checking using the .checked property to check if the checkbox is checked.

You can check the full code below.

<input type="checkbox" id="checkbox_id" checked>
<div id="status"></div>

<script>
    var checkbox = document.getElementById("checkbox_id");

    checkbox.addEventListener('change', function() {
        document.getElementById("status").innerHTML = checkbox.checked
    });
</script>

Live Demo

var checkbox = document.getElementById("checkbox_id");

checkbox.addEventListener('change', function() {
    if (checkbox.checked) {
        // -> Checkbox is checked
    } else {
        // -> Checkbox is not checked
    }
});
In the code, we are checking the checkbox checking status when we are clicking on it and it is selecting or un-selecting.
var checkbox = document.getElementById("checkbox_id");

checkbox.addEventListener('change', function() {
    if (checkbox.checked) {
        alert("Checkbox is selected");
    }
});
In the above code, we are showing an alert when the checkbox is selected.
Was this helpful?
0 Comments
Join Devsheet Ask a Question