jQuery: Testen Sie, ob das Kontrollkästchen NICHT aktiviert ist

Ich habe Probleme, das herauszufinden. Ich habe zwei Kontrollkästchen (in Zukunft werden mehr vorhanden sein):

• checkSurfaceEnvironment-1
• checkSurfaceEnvironment-2

Grundsätzlich möchte ich eine if-Anweisung schreiben und testen, ob eine davon aktiviert ist und eine andere NICHT aktiviert ist. Was ist der einfachste Weg, um Folgendes zu erreichen:

if ( $("#checkSurfaceEnvironment-1").attr('checked', true) &&
     $("#checkSurfaceEnvironment-2").is('**(NOT??)** :checked') ) {
        // do something
}

Ein zuverlässiger Weg, den ich benutze, ist:

if($("#checkSurfaceEnvironment-1").prop('checked') == true){
    //do something
}

Wenn Sie über markierte Elemente iterieren möchten, verwenden Sie das übergeordnete Element

$("#parentId").find("checkbox").each(function(){
    if ($(this).prop('checked')==true){ 
        //do something
    }
});

Mehr Info:

Dies funktioniert gut, da für alle Kontrollkästchen eine Eigenschaft aktiviert ist, in der der tatsächliche Status des Kontrollkästchens gespeichert ist. Wenn Sie möchten, können Sie die Seite überprüfen und versuchen, ein Kontrollkästchen zu aktivieren und zu deaktivieren. Sie werden feststellen, dass das Attribut "aktiviert" (falls vorhanden) gleich bleibt. Dieses Attribut repräsentiert nur den Anfangszustand des Kontrollkästchens und nicht den aktuellen Zustand. Der aktuelle Status wird in der Eigenschaft gespeichert, die vom dom-Element für dieses Kontrollkästchen aktiviert wurde.

Siehe Eigenschaften und Attribute in HTML

if (!$("#checkSurfaceEnvironment-1").is(":checked")) {
    // do something if the checkbox is NOT checked
}

Sie können auch entweder die jQuery- .not()Methode oder den :not()Selektor verwenden:

if ($('#checkSurfaceEnvironment').not(':checked').length) {
    // do stuff for not selected
}

JSFiddle-Beispiel

Zusätzliche Bemerkungen

Aus der jQuery-API-Dokumentation für den :not() Selektor :

Die .not () -Methode bietet Ihnen am Ende besser lesbare Auswahlmöglichkeiten, als komplexe Selektoren oder Variablen in einen : not () - Selektorfilter zu verschieben . In den meisten Fällen ist es eine bessere Wahl.

Ein alternativer Weg:

Hier ist ein funktionierendes Beispiel und hier ist der Code, Sie sollten auch prop verwenden.

$('input[type="checkbox"]').mouseenter(function() { 
    if ($(this).is(':checked')) {
        //$(this).prop('checked',false);
        alert("is checked");
    } else {
         //$(this).prop('checked',true);
        alert("not checked");
    }
});​

Ich habe den Weg zum Umschalten des aktivierten Attributs auskommentiert.

if ( $("#checkSurfaceEnvironment-1").is(":checked") && $("#checkSurfaceEnvironment-2").not(":checked") )

Ich suchte nach einer direkteren Implementierung, wie von avijendr vorgeschlagen.

Ich hatte ein kleines Problem mit seiner / ihrer Syntax, aber ich habe das zum Laufen gebracht:

if ($('.user-forms input[id*="chkPrint"]:not(:checked)').length > 0)

In meinem Fall hatte ich eine Tabelle mit einer Klasse user-forms, und ich war die Überprüfung , wenn eine der Kontrollkästchen, die die Zeichenfolge hatten checkPrintin ihrer idunkontrolliert war.

Ich denke, der einfachste Weg (mit jQuery) zu überprüfen, ob das Kontrollkästchen aktiviert ist oder NICHT, ist:

wenn 'markiert':

if ($(this).is(':checked')) {
// I'm checked let's do something
}

wenn NICHT 'geprüft':

if (!$(this).is(':checked')) {
// I'm NOT checked let's do something
}

Hier habe ich einen Ausschnitt für diese Frage.

$(function(){
   $("#buttoncheck").click(function(){
        if($('[type="checkbox"]').is(":checked")){
            $('.checkboxStatus').html("Congratulations! "+$('[type="checkbox"]:checked').length+" checkbox checked");
        }else{
            $('.checkboxStatus').html("Sorry! Checkbox is not checked");
         }
         return false;
   })
    
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <p>
    <label>
      <input type="checkbox" name="CheckboxGroup1" value="checkbox" id="CheckboxGroup1_0">
      Checkbox</label>
    <br>
    <label>
      <input type="checkbox" name="CheckboxGroup1_" value="checkbox" id="CheckboxGroup1_1">
      Checkbox</label>
    <br>
  </p>
  <p>
    <input type="reset" value="Reset">
    <input type="submit" id="buttoncheck" value="Check">
  </p>
  <p class="checkboxStatus"></p>
</form>

Um es so zu machen, .attr()wie Sie es getan haben, um zu sehen, ob es überprüft wurde .attr("checked", "checked"), und wenn es nicht ist, wäre es das.attr("checked") == undefined

Geben Sie true zurück, wenn alle checbox in einem div aktiviert sind

function all_checked (id_div){
 all_checked = true;

 $(id_div+' input[type="checkbox"]').each(function() { 
    all_checked = all_checked && $('this').prop('checked');
 }

 return all_checked;
}

Einfach und leicht zu überprüfender oder ungeprüfter Zustand

<input type="checkbox" id="ev-click" name="" value="" >

<script>
    $( "#ev-click" ).click(function() {
        if(this.checked){
            alert('checked');
        }
        if(!this.checked){
            alert('Unchecked');
        }
    });
</script>

Probier diese

if ($("#checkSurfaceEnvironment-1:checked").length>0) {
    //your code in case of NOT checked
}

Wählen Sie im obigen Code das Element nach ID aus (#checkSurfaceEnvironment-1)und filtern Sie dann den überprüften Status nach (:checked)Filter heraus.

Es wird ein Array des überprüften Elementobjekts zurückgegeben. Wenn im Array ein Objekt vorhanden ist, ist die Bedingung erfüllt.

Es gibt zwei Möglichkeiten, den Zustand zu überprüfen.

if ($("#checkSurfaceEnvironment-1").is(":checked")) {
    // Put your code here if checkbox is checked
}

ODER Sie können diesen auch verwenden

if($("#checkSurfaceEnvironment-1").prop('checked') == true){
    // Put your code here if checkbox is checked
}

Ich hoffe das ist nützlich für dich.

Hier ist der einfachste Weg angegeben

 <script type="text/javascript">

        $(document).ready(function () {
            $("#chk_selall").change("click", function () {

                if (this.checked)
                {
                    //do something
                }
                if (!this.checked)
                {
                    //do something

                }

            });

        });

    </script>

Ich habe das benutzt und für mich gearbeitet!

$("checkbox selector").click(function() {
    if($(this).prop('checked')==true){
       do what you need!
    }
});

Ich weiß, dass dies bereits beantwortet wurde, aber dennoch ist dies ein guter Weg, dies zu tun:

if ($("#checkbox").is(":checked")==false) {
    //Do stuff here like: $(".span").html("<span>Lorem</span>");
}

if($("#checkbox1").prop('checked') == false){
    alert('checkbox is not checked');
    //do something
}
else
{ 
    alert('checkbox is checked');
}

$("#chkFruits_0,#chkFruits_1,#chkFruits_2,#chkFruits_3,#chkFruits_4").change(function () {
        var item = $("#chkFruits_0,#chkFruits_1,#chkFruits_2,#chkFruits_3,#chkFruits_4");
    if (item.is(":checked")==true) {
        //execute your code here
    }

    else if (item.is(":not(:checked)"))
    {
        //execute your code here
    }

});