Check / uncheck Checkbox mit Jquery?

Ich habe einige Textfelder in meiner Seite und zeige deren Werte mit JavaScript an.

Ich verwende die Funktion "set("value","")", um den Wert zu bearbeiten, ein zusätzliches Kontrollkästchenfeld hinzuzufügen und einen Wert zu übergeben.

Hier möchte ich prüfen, ob das Kontrollkästchen aktiviert werden soll, wenn "Wert == 1" ist. Andernfalls soll es nicht angekreuzt bleiben.

Ich habe dies mit zwei divs gemacht, aber ich fühle mich nicht wohl dabei, gibt es eine andere Lösung?

if(value == 1) {
    $('#uncheck').hide();
    $('#check').show();
} else{
    $('#uncheck').show();
    $('#check').hide();
}
Aniket G
Bearbeitete Frage 11. März 2019 в 11:51
Programmierung
jquery jquery-ui
2. Juli 2013 в 8:09
16 Aufrufe
Lösung

Für jQuery 1.6+ :

.attr() ist für Eigenschaften veraltet; verwenden Sie stattdessen die neue Funktion .prop() als:

$('#myCheckbox').prop('checked', true); // Checks it
$('#myCheckbox').prop('checked', false); // Unchecks it

Für jQuery < 1.6:

Um ein Kontrollkästchen zu aktivieren/deaktivieren, verwenden Sie das Attribut checked und ändern Sie es. Mit jQuery können Sie das tun:

$('#myCheckbox').attr('checked', true); // Checks it
$('#myCheckbox').attr('checked', false); // Unchecks it

Denn in HTML würde es etwa so aussehen:

<input type="checkbox" id="myCheckbox" checked="checked" /> 
<input type="checkbox" id="myCheckbox" />

Sie können sich jedoch nicht auf die Methode .attr() verlassen, um den Wert des Kontrollkästchens zu erhalten (falls Sie ihn benötigen). Sie müssen sich auf die Methode .prop() verlassen.

Christopher Taylor
Bearbeitete Antwort 19. Januar 2018 в 9:14
Kommentare (16)

Sie können dafür prop() verwenden, da Vor jQuery 1.6 die Methode .attr() beim Abrufen einiger Attribute manchmal Eigenschaftswerte berücksichtigte, was zu inkonsistentem Verhalten führen konnte. Ab jQuery 1.6 bietet die Methode .prop() eine Möglichkeit, explizit Eigenschaftswerte abzurufen, während .attr() Attribute abruft.

var prop=false;
if(value == 1) {
   prop=true; 
}
$('#checkbox').prop('checked',prop);

oder einfach,

$('#checkbox').prop('checked',(value == 1));

Snippet

$(document).ready(function() {
  var chkbox = $('.customcheckbox');
  $(".customvalue").keyup(function() {
    chkbox.prop('checked', this.value==1);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<h4>This is a domo to show check box is checked
if you enter value 1 else check box will be unchecked </h4>
Enter a value:
<input type="text" value="" class="customvalue">
<br>checkbox output :
<input type="checkbox" class="customcheckbox">
Rohan Kumar
Bearbeitete Antwort 31. Januar 2017 в 4:35
Kommentare (0)

Sie können den Status des Kontrollkästchens auf der Grundlage des Wertes festlegen:

$('#your-checkbox').prop('checked', value == 1);
Kommentare (1)