jQuery prüft, ob Kontrollkästchen aktiviert oder nicht aktiviert sind

126

Ich kann sehen, ob ein einzelnes Kontrollkästchen aktiviert ist oder nicht.

Aber Im Probleme mit der folgenden - gegeben eine Form id Ich muss sehen , ob jede der Kontrollkästchen ausgewählt werden (dh 1 oder mehr), und ich brauche , um zu sehen , wenn keine ausgewählt sind. Grundsätzlich brauche ich zwei separate Funktionen, die diese beiden Fragen beantworten. Hilfe wäre dankbar. Vielen Dank!

Eigentlich würde ich nur eine Funktion brauchen, um mir zu sagen, ob keine ausgewählt sind. Das zu wissen würde die andere Frage beantworten.

bba
quelle

Antworten:

246

Sie können so etwas verwenden

if ($("#formID input:checkbox:checked").length > 0)
{
    // any one is checked
}
else
{
   // none is checked
}
rahul
quelle
8
$("#formID input:checkbox:checked").lengthwürde auch hier ausreichen
Damon
@Damon Ich denke du meintest if ($("#formID input:checkbox:checked").length){}(ohne das >0) würde ausreichen, weil 0 ein Falsey-Wert ist, siehe james.padolsey.com/javascript/truthy-falsey
Adrien Be
11
jQuery sagt bezüglich des :checkboxSelektors: For better performance in modern browsers, use [type="checkbox"]siehe api.jquery.com/checkbox-selector - dasselbe gilt übrigens für Radiobuttons, use [type="radio"] rather than :radio api.jquery.com/radio-selector
Adrien Be
27

JQuery testet .isalle angegebenen Elemente und gibt true zurück, wenn mindestens eines davon mit dem Selektor übereinstimmt:

if ($(":checkbox[name='choices']", form).is(":checked"))
{
    // one or more checked
}
else
{
    // nothing checked
}
Michael Logutov
quelle
Der Gedanke is()scheint zu funktionieren, :checkeddirekt im Selektor zu sein, wie in @ rahuls Antwort angegeben, scheint angemessener. is () scheint nützlicher zu sein, wenn "Inside Callbacks", siehe api.jquery.com/is . Oder fehlt mir etwas?
Adrien Be
Nein, es ist so ziemlich das, was in Dokumenten geschrieben steht - Sie überprüfen, ob ein Element mit dem angegebenen Attribut übereinstimmt. Das Anwenden als Filter und das anschließende Überprüfen, ob mindestens ein Element im Ergebnis ist, ist das gleiche, aber nicht länger und nicht so ausdrucksstark.
Michael Logutov
+1 für die Tatsache, dass .is(":checked")in Ihrer Lösung ausdrucksstärker ist, aber nicht sicher über den Rest.
Adrien Be
Könnte $("form input[type=checkbox]").is(":checked")nämlich ein einfacherer und allgemeinerer Ansatz sein.
Adrien Be
@AdrienBe Using ist ismöglicherweise eine bessere Leistung, da es beendet wird, sobald es eine findet.
ChrisW
8

Du kannst das:

  if ($('#form_id :checkbox:checked').length > 0){
    // one or more checkboxes are checked
  }
  else{
   // no checkboxes are checked
  }

Wo:

  • :checkbox Filterauswahl aktiviert alle Kontrollkästchen.
  • :checked aktiviert aktivierte Kontrollkästchen
  • length gibt dort die Anzahl der markierten an
Sarfraz
quelle
jQuery sagt bezüglich des :checkboxSelektors: For better performance in modern browsers, use [type="checkbox"]siehe api.jquery.com/checkbox-selector
Adrien Be
6

Dies ist, was ich verwendet habe, um zu überprüfen, ob sich Kontrollkästchen in einer Liste von Kontrollkästchen geändert haben:

$('input[type="checkbox"]').change(function(){ 

        var itemName = $('select option:selected').text();  

         //Do something.

});     
James Drinkard
quelle
6

Ohne 'Länge' können Sie dies folgendermaßen tun:

if ($('input[type=checkbox]').is(":checked")) {
      //any one is checked
}
else {
//none is checked
}
Acheme Paul
quelle
3

Sie können eine einfache Rückgabe des .lengthhier machen:

function areAnyChecked(formID) {
  return !!$('#'+formID+' input[type=checkbox]:checked').length;
}

Diese Suche nach Kontrollkästchen in der angegebenen Form prüft, ob sie vorhanden sind, :checkedund gibt zurück, trueob sie vorhanden sind (da die Länge sonst 0 wäre). Um es ein bisschen klarer zu machen, hier ist die nicht boolesche konvertierte Version:

function howManyAreChecked(formID) {
  return $('#'+formID+' input[type=checkbox]:checked').length;
}

Dies würde eine Zählung der Anzahl der überprüften zurückgeben.

Nick Craver
quelle
3

Rahuls Antwort passt am besten zu Ihrer Frage. Wenn Sie eine Gruppe von Kontrollkästchen aktivieren müssen und nicht alle Kontrollkästchen in Ihrem Formular, können Sie dies tun.

Geben Sie einen Klassennamen für alle Kontrollkästchen ein, die Sie aktivieren möchten, z. B. einen Klassennamen. test_checkJetzt können Sie überprüfen, ob eines der Kontrollkästchen der Gruppe aktiviert ist, indem Sie:

$("#formID .test_check:checked").length > 0

Wenn es zurückgegeben wird true, nehmen Sie an , dass ein oder mehrere Kontrollkästchen mit dem Klassennamen aktiviert sind test_checkund keines aktiviert ist , wenn zurückgegeben wird false.

Hoffe es hilft jemandem. Vielen Dank :)-

Rajesh Omanakuttan
quelle
1

Dies ist der beste Weg, um dieses Problem zu lösen.

  if($("#checkbox").is(":checked")){

  // Do something here /////

  };
Asiamah Amos
quelle
Hey, willkommen bei StackOverflow. Vielleicht können Sie Ihre Antwort etwas genauer beschreiben, da nicht ersichtlich ist, warum dies der "beste Weg" ist, um das Problem zu lösen.
dddJewelsbbb