Überprüfen Sie, ob alle Kontrollkästchen aktiviert sind

Wie überprüfe ich, ob alle Kontrollkästchen mit aktiviert class="abc"sind?

Ich muss es jedes Mal überprüfen, wenn einer von ihnen aktiviert oder deaktiviert ist. Mache ich es beim Klicken oder Ändern?

Ich denke, der einfachste Weg ist, nach diesem Zustand zu suchen:

$('.abc:checked').length == $('.abc').length

Sie können dies jedes Mal tun, wenn ein neues Kontrollkästchen aktiviert ist:

$(".abc").change(function(){
    if ($('.abc:checked').length == $('.abc').length) {
       //do something
    }
});

$('input.abc').not(':checked').length > 0

Sie können verwenden change()

$("input[type='checkbox'].abc").change(function(){
    var a = $("input[type='checkbox'].abc");
    if(a.length == a.filter(":checked").length){
        alert('all checked');
    }
});

Dadurch wird lediglich überprüft, ob die Gesamtzahl der .abcKontrollkästchen mit der Gesamtzahl der Kontrollkästchen übereinstimmt .abc:checked.

Codebeispiel auf jsfiddle .

$('.abc[checked!=true]').length == 0

Teil 1 Ihrer Frage:

var allChecked = true;
$("input.abc").each(function(index, element){
  if(!element.checked){
    allChecked = false;
    return false;
  } 
});

BEARBEITEN:

Die Antwort (http://stackoverflow.com/questions/5541387/check-if-all-checkboxes-are-selected/5541480#5541480) oben ist wahrscheinlich besser.

Das Suchkriterium ist eines davon:

input[type=checkbox].MyClass:not(:checked)
input[type=checkbox].MyClass:checked

Sie möchten wahrscheinlich eine Verbindung zum Änderungsereignis herstellen.

Alternativ hätten Sie auch every () verwenden können:

// Cache DOM Lookup
var abc = $(".abc");

// On Click
abc.on("click",function(){

    // Check if all items in list are selected
    if(abc.toArray().every(areSelected)){
        //do something
    }

    function areSelected(element, index, array){
        return array[index].checked;
    }
});

Eine klassenunabhängige Lösung

var checkBox = 'input[type="checkbox"]';
if ($(checkBox+':checked').length == $(checkBox).length) {
   //Do Something
}

So habe ich es in meinem Code erreicht:

if($('.citiescheckbox:checked').length == $('.citiescheckbox').length){
    $('.citycontainer').hide();
}else{
    $('.citycontainer').show();
}