复选框onclick取消选中其他复选框

Question

I have 6 checkboxes, one for each business day and one that says 'all'.

What i want to be able to do is uncheck all the other boxes if someone clicks the 'all' checkbox if that makes sense.

For example, if someone has clicked monday and wednesday ... then they come in and click the 'all' checkbox, then the monday and wednesday checkbox should uncheck.

Cheers,

Answer 1

This is not you want, but seems to be more sensible.

HTML

<input type="checkbox" id="chkAll" />
<br />
<input type="checkbox" id="chkMonday" class="child" />
<input type="checkbox" id="chkTuesday" class="child" />
<input type="checkbox" id="chkWednesday" class="child" />
<input type="checkbox" id="chkThursday" class="child" />
<input type="checkbox" id="chkFriday" class="child" />
<input type="checkbox" id="chkSaturday" class="child" />
<input type="checkbox" id="chkSunday" class="child" />

jQUery

$(function(){
    $("#chkAll").change(function(){
        if (this.checked) {
            $("input:checkbox.child").attr("checked", "checked");
        }
        else {
            $("input:checkbox.child").removeAttr("checked");
        }
    });
});

See a working demo

See an updated version which handles change in the child checkboxes also.

Answer 2

jquery and some code like this should do it.

$('#all-id').change(function(){
   if($('#all-id').is(':checked')){
     if($('#monday-id').is(':checked')){
        $('#monday-id').attr('checked', false);
     } else {
       $('#monday-id').attr('checked', true);
     }
     // etc
   }
});

After you might want to put all the ids in an array and setup a loop or play with the structure of your document to be able to easily loop on all of those checkboxes