How To Detect A Checkbox Click In Jquery

I cannot detect when and which checkbox gets clicked from script below: HTML Snippet:

Solution 1:

If you are adding this HTML dinamically, you should use the .on() method, like:

$(document).on('change', '.detectThisChange', function() {
    // your code
});

Give it a try and let me know if it helps.

Solution 2:

Try like this

$("input[type=checkbox]").is(":checked") // returns boolean checked or unchecked

---

var arr = [];
    $("input[type=checkbox]").each(function () {
        var self = $(this);
        if (self.is(':checked')) {
            arr.push(self.attr("id"));
        }
    });
    console.log(arr);

EdIted:

$("input[type=checkbox]").on('change', function () {
    var self = $(this);
    if (self.is(":checked")) {
        console.log("checkbox  id =" + self.attr("id") + "is checked ");
    } else {
        console.log("Id = " + self.attr("id") + "is Unchecked ");
    }
});

Edited 2 :

$("body").on('change','.detectThisChange', function () {
    var self = $(this);
    if (self.is(":checked")) {
        console.log("checkbox  id =" + self.attr("id") + "is checked ");
    } else {
        console.log("Id = " + self.attr("id") + "is Unchecked ");
    }
});

Working Demo

Solution 3:

Try this :

$(".detectThisChange").on('change', function () {

    alert("In the function");
    var targetID = this.id; // get the id that triggered the eventvar posStart = targetID.indexOf('[') + 1;
    var posEnd = targetID.indexOf(']');
    var i = targetID.substring(posStart, posEnd); // get the index of the id that triggered the eventif ($('#checkbox\\[' + i + '\\]').prop('checked') == true) {
        alert('checkbox ' + i + ' was checked');
    } else {
        alert('checkbox ' + i + ' was unchecked');
    }
});

Here's the JSFiddle, even though you have an answer :)

Solution 4:

Try:)

if ( $('#checkbox\\['+ i +'\\]').is(":checked") ) {
  alert('checkbox ' + i + ' was checked');
}
else {
  alert('checkbox ' + i + ' was unchecked');
}

Share