.prop ('geprüft', falsch) oder .removeAttr ('geprüft')?

115

Mit der Einführung der Requisitenmethode muss ich nun die akzeptierte Methode zum Deaktivieren eines Kontrollkästchens kennen. Ist es:

$('input').filter(':checkbox').removeAttr('checked');

oder

$('input').filter(':checkbox').prop('checked',false);
Phillip Senn
quelle
4
Hast du John Resigs Beitrag gelesen? ejohn.org/blog/jquery-16-and-attr
Jared Farrish

Antworten:

130

jQuery 3

Wie von jQuery 3, removeAttrist nicht festgelegt , die entsprechende Eigenschaft auf falsemehr:

Vor jQuery 3.0, indem .removeAttr()auf einem boolean - Attribute wie checked, selectedoder readonlywürde auch die entsprechende benannte Eigenschaft zu setzen false. Dieses Verhalten war für alte Versionen von Internet Explorer erforderlich, ist jedoch für moderne Browser nicht korrekt, da das Attribut den Anfangswert und die Eigenschaft den aktuellen (dynamischen) Wert darstellt.

Es ist fast immer ein Fehler, .removeAttr( "checked" )ein DOM-Element zu verwenden. Es kann nur nützlich sein, wenn das DOM später wieder in eine HTML-Zeichenfolge serialisiert wird. In allen anderen Fällen .prop( "checked", false )sollte stattdessen verwendet werden.

Änderungsprotokoll

Daher ist nur .prop('checked',false)bei Verwendung dieser Version der richtige Weg.


Ursprüngliche Antwort (ab 2011):

Für Attribute mit zugrunde liegenden booleschen Eigenschaften (von denen checkedeine eins ist) wird removeAttrdie zugrunde liegende Eigenschaft automatisch auf festgelegt false. (Beachten Sie, dass dies zu den in jQuery 1.6.1 hinzugefügten "Korrekturen" für die Abwärtskompatibilität gehört.)

Beides wird also funktionieren ... aber das zweite Beispiel, das Sie (mit prop) gegeben haben, ist das korrektere der beiden. Wenn Sie das Kontrollkästchen deaktivieren möchten, möchten Sie die Eigenschaft und nicht das Attribut wirklich beeinflussen , und Sie müssen dies nicht durchgehen removeAttr.

John Flatness
quelle
36
@tandu: Du kannst , aber du solltest nicht. Aus den Dokumenten: " Hinweis: Verwenden Sie [ removeProp()] nicht, um native Eigenschaften wie aktiviert, deaktiviert oder ausgewählt zu entfernen. Dadurch wird die Eigenschaft vollständig entfernt und kann nach dem Entfernen nicht mehr zum Element hinzugefügt werden. Verwenden Sie .prop()diese Option , um diese Eigenschaften auf false zu setzen stattdessen." removePropist wirklich nur für die Verwendung mit benutzerdefinierten Eigenschaften vorgesehen.
John Flatness
17

use checked: true, false Eigenschaft des Kontrollkästchens.

jQuery:

if($('input[type=checkbox]').is(':checked')) {
    $(this).prop('checked',true);
} else {
    $(this).prop('checked',false);
}
suraj rawat
quelle
Wir können eliminieren, wenn sonst (unter Verwendung eines Liners) $ (this) .prop ('markiert', $ ('Eingabe [Typ = Kontrollkästchen]'). Ist (': geprüft'));
Yousaf Hassan
8

Ich empfehle, sowohl prop als auch attr zu verwenden, da ich Probleme mit Chrome hatte und es mit beiden Funktionen gelöst habe.

if ($(':checkbox').is(':checked')){
    $(':checkbox').prop('checked', true).attr('checked', 'checked');
}
else {
    $(':checkbox').prop('checked', false).removeAttr('checked');
}
Ragnar
quelle
Ja, für Chrom verwenden Sie: $("input[type='checkbox'], input[type='radio']").prop("checked", false).attr("checked", false).removeAttr("checked");
Rod
Ich verwende eine benutzerdefinierte Komponente (CSS + JS), um das Eingangsradio und das Kontrollkästchen zu ersetzen. Dies ist der einzige Weg, der für mich funktioniert. Vielen Dank!
Silvio Delgado
3

Eine andere Alternative, um dasselbe zu tun, besteht darin, nach dem Attribut type = checkbox zu filtern :

$('input[type="checkbox"]').removeAttr('checked');

oder

$('input[type="checkbox"]').prop('checked' , false);

Denken Sie daran, dass der Unterschied zwischen Attributen und Eigenschaften in bestimmten Situationen wichtig sein kann. Vor jQuery 1.6 berücksichtigte die Methode .attr () manchmal Eigenschaftswerte, wenn einige Attribute abgerufen wurden, was zu inkonsistentem Verhalten führen kann. Ab jQuery 1.6 bietet die .prop () -Methode eine Möglichkeit, Eigenschaftswerte explizit abzurufen, während .attr () Attribute abruft.

Erfahren Sie mehr ...

tonnoz
quelle
2
Die Frage war "Welche davon ist korrekter" und nicht "Gibt es andere Möglichkeiten, dies zu tun?". Sie scheinen nicht versucht zu haben, die Frage zu beantworten
Andrew Stubbs