Jquery, How get checkbox unchecked event and checkbox value?

Question

I want to get checkbox value using jQuery when to uncheck the checked checkbox and show that unchecked value in the popup. I've tried below code but it not work

$("#countries input:checkbox:not(:checked)").click(function(){
    var val = $(this).val();
    alert('uncheckd' + val);
}); 

Is it possible to get unchecked value in this way?

Answer 1

Your selector will only attach event to element which are selected in the beginning. You need to determine check unchecked state when value is changed:

$("#countries input:checkbox").change(function() {
    var ischecked= $(this).is(':checked');
    if(!ischecked)
    alert('uncheckd ' + $(this).val());
}); 

Working Demo

Answer 2

You should check the condition on click or change. I hope that my example will help you.

    $("input:checkbox.country").click(function() {
        if(!$(this).is(":checked"))
        alert('you are unchecked ' + $(this).val());
    }); 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

    <input class="country" type="checkbox" name="country1" value="India" /> India </br>
    <input class="country" type="checkbox" name="country1" value="Russia" /> Russia <br>
    <input class="country" type="checkbox" name="country1" value="USA" /> USA <br>
    <input class="country" type="checkbox" name="country1" value="UK" /> UK