Testen, ob ein Kontrollkästchen mit jQuery aktiviert ist


588

Wenn das Kontrollkästchen aktiviert ist, muss ich nur den Wert 1 erhalten. Andernfalls muss ich es als 0 erhalten. Wie mache ich das mit jQuery?

$("#ans").val() wird mir in diesem Fall immer ein Recht geben:

<input type="checkbox" id="ans" value="1" />

2
.val () dient zum Abrufen des Wertattributs und nicht des Prüfstatus. Das value-Attribut kann alles sein, es muss nicht boolesch sein.
Pablo Pazos

Wenn Sie noch in der
Nähe

Antworten:


1008

Verwenden .is(':checked')Sie diese Option, um festzustellen, ob sie aktiviert ist, und legen Sie dann Ihren Wert entsprechend fest.

Weitere Informationen hier.


1
Wenn Sie $ ("# id"). Is ("check") in einer if-Klausel ausführen, erhalten Sie außerdem true oder false, nicht on / off, und Sie können es an Ihr Back-End-Skript senden und mach was du willst.
Zanoldor

1
Wahrscheinlich spielt dies heutzutage keine Rolle: ReSharper (ich denke) gibt eine Warnung aus " Die Pseudoklasse 'geprüft' ist nicht mit Internet Explorer 8.0 kompatibel ".
Uwe Keim

211
$("#ans").attr('checked') 

wird Ihnen sagen, ob es aktiviert ist. Sie können auch einen zweiten Parameter true / false verwenden, um das Kontrollkästchen zu aktivieren / deaktivieren.

$("#ans").attr('checked', true);

Verwenden Sie pro Kommentar propanstelle von, attrwenn verfügbar. Z.B:

$("#ans").prop('checked')

90

Benutz einfach $(selector).is(':checked')

Es gibt einen booleschen Wert zurück.


56
// use ternary operators
$("#ans").is(':checked') ? 1 : 0;

@Loic, um seinen Wert mit der knappen ternären Syntax festzulegen, zB :: a = ischecked? 1: 0

21

Die Antwort von Stefan Brinkmann ist ausgezeichnet, für Anfänger jedoch unvollständig (ohne Variablenzuordnung). Nur um klarzustellen:

// this structure is called a ternary operator
var cbAns = ( $("#ans").is(':checked') ) ? 1 : 0;

Es funktioniert so:

 var myVar = ( if test goes here ) ? 'ans if yes' : 'ans if no' ;

Beispiel:

var myMath = ( 1 > 2 ) ? 'yes' : 'no' ;
alert( myMath );

Warnungen "Nein"

Wenn dies hilfreich ist, stimmen Sie bitte der Antwort von Stefan Brinkmann zu.



15

Ich habe das gleiche Problem schon einmal gefunden, hoffe, diese Lösung kann Ihnen helfen. Fügen Sie zunächst Ihren Kontrollkästchen ein benutzerdefiniertes Attribut hinzu:

<input type="checkbox" id="ans" value="1" data-unchecked="0" />

Schreiben Sie eine jQuery-Erweiterung, um den Wert abzurufen:

$.fn.realVal = function(){
    var $obj = $(this);
    var val = $obj.val();
    var type = $obj.attr('type');
    if (type && type==='checkbox') {
        var un_val = $obj.attr('data-unchecked');
        if (typeof un_val==='undefined') un_val = '';
        return $obj.prop('checked') ? val : un_val;
    } else {
        return val;
    }
};

Verwenden Sie den Code, um den Wert des Kontrollkästchens abzurufen:

$('#ans').realVal();

Sie können hier testen


10
... weil jQuery als "the write more do less" -Bibliothek bekannt ist
myshadowself

lange Geschichte, Sie sind zu weit gegangen JQUERY möchte, dass Entwickler weniger schreiben und mehr tun. einfaches Problem verdient einfache Lösung
ShapCyber

ja, einverstanden, weniger schreiben, mehr tun. Sie schreiben die Erweiterung einmal und für den Rest der Zeit rufen Sie nur die API $ (someradio) .realVal () auf. Sie müssen nicht oft eine Erweiterung schreiben.
Alphakevin

Sie mussten die Erweiterung nicht einmal schreiben, egal 'oft'! Oo
Coz

8
$('input:checkbox:checked').val();        // get the value from a checked checkbox

7
<input type="checkbox" id="ans" value="1" />

Jquery: var test= $("#ans").is(':checked') und es gibt wahr oder falsch zurück.

In Ihrer Funktion:

$test =($request->get ( 'test' )== "true")? '1' : '0';


4

Verwenden:

$("#ans option:selected").val()

Wenn es nicht ausgewählt ist, würde der erste Teil nichts zurückgeben, oder?
Xaxxon

@Senthil, OP fragt nicht nach dem Wert eines ausgewählten Kontrollkästchens, sondern return 1wenn es aktiviert ist
Om Shankar

4
function chkb(bool){
if(bool)
return 1;
return 0;
}

var statusNum=chkb($("#ans").is(':checked'));

statusNum ist gleich 1, wenn das Kontrollkästchen aktiviert ist, und 0, wenn dies nicht der Fall ist.

BEARBEITEN: Sie können das DOM auch zur Funktion hinzufügen.

function chkb(el){
if(el.is(':checked'))
return 1;
return 0;
}

var statusNum=chkb($("#ans"));

4

Ich bin kürzlich durch einen Fall gekommen, in dem ich den Kontrollkästchenwert des Kontrollkästchens benötigte, als der Benutzer auf die Schaltfläche klickte. Der einzig richtige Weg, dies zu tun, ist die Verwendung von prop()Attributen.

var ansValue = $("#ans").prop('checked') ? $("#ans").val() : 0;

Das hat in meinem Fall funktioniert, vielleicht wird es jemand brauchen.

Als ich es ausprobiert habe, wurde .attr(':checked')es zurückgegeben, checkedaber ich wollte einen booleschen Wert und einen .val()zurückgegebenen Wert des Attributs value.


4

Es gibt verschiedene Möglichkeiten wie ....

 1. $("#ans").is(':checked') 
 2. $("#ans:checked")
 3. $('input:checkbox:checked'); 

Wenn alle diese Optionen true zurückgeben, können Sie den Wert entsprechend festlegen.


Der erste sollte sein (': markiert'), funktioniert sonst nicht.
Arie Livshin

2

Versuche dies

$('input:checkbox:checked').click(function(){
    var val=(this).val(); // it will get value from checked checkbox;
})

Hier ist das Flag wahr, wenn es sonst falsch markiert ist

var flag=$('#ans').attr('checked');

Wieder wird dies cheked machen

$('#ans').attr('checked',true);


0

Mit diesen beiden Methoden können Sie einen Wert (wahr / falsch) erhalten

$("input[type='checkbox']").prop("checked");
$("input[type='checkbox']").is(":checked");

0

Überprüfen Sie zuerst, ob der Wert überprüft wurde

$("#ans").find("checkbox").each(function(){
    if ($(this).prop('checked')==true){ 
    var id = $(this).val()
    }
});

Andernfalls setzen Sie den Wert 0


0

Wenn Sie möchten, dass der ganzzahlige Wert aktiviert ist oder nicht, versuchen Sie Folgendes:

$("#ans:checked").length

0

Sie können es folgendermaßen ausführen:

$('input[id=ans]').is(':checked');     
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.