.prop ('vérifié', faux) ou .removeAttr ('vérifié')?

115

Avec l'introduction de la méthode prop, j'ai maintenant besoin de connaître la manière acceptée de décocher une case. Est-ce:

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

ou

$('input').filter(':checkbox').prop('checked',false);

jquery Phillip Senn
la source

4

Avez-vous lu le message de John Resig? ejohn.org/blog/jquery-16-and-attr

Jared Farrish

130

jQuery 3

A partir de 3 jQuery, removeAttrne pas définir la propriété correspondant à falseplus:

Avant jQuery 3.0, en utilisant .removeAttr()un attribut booléen tel que checked, selectedou readonlyfixerait également la propriété nommée correspondant false. Ce comportement était requis pour les anciennes versions d'Internet Explorer mais n'est pas correct pour les navigateurs modernes car l'attribut représente la valeur initiale et la propriété représente la valeur (dynamique) actuelle.

C'est presque toujours une erreur à utiliser .removeAttr( "checked" )sur un élément DOM. La seule fois où cela peut être utile, c'est si le DOM sera ultérieurement sérialisé en une chaîne HTML. Dans tous les autres cas, .prop( "checked", false )doit être utilisé à la place.

Changelog

Par conséquent, seule .prop('checked',false)la manière correcte est d'utiliser cette version.

Réponse originale (de 2011):

Pour les attributs qui ont des propriétés booléennes sous-jacentes (dont checkedune), removeAttrdéfinit automatiquement la propriété sous-jacente sur false. (Notez que cela fait partie des "correctifs" de compatibilité ascendante ajoutés dans jQuery 1.6.1).

Donc, l'un ou l'autre fonctionnera ... mais le deuxième exemple que vous avez donné (en utilisant prop) est le plus correct des deux. Si votre objectif est de décocher la case, vous voulez vraiment affecter la propriété , pas l'attribut, et il n'est pas nécessaire de passer par là removeAttrpour le faire.

John Flatness
la source

36

@tandu: Vous pouvez , mais vous ne devriez pas. Dans la documentation: " Remarque: n'utilisez pas [ removeProp()] pour supprimer des propriétés natives telles que cochées, désactivées ou sélectionnées. Cela supprimera complètement la propriété et, une fois supprimée, ne pourra plus être ajoutée à l'élément. Utilisez cette option .prop()pour définir ces propriétés sur false au lieu." removePropest vraiment destiné à être utilisé avec des propriétés personnalisées uniquement.

John Flatness

17

use checked: true, false propriété de la case à cocher.

jQuery:

if($('input[type=checkbox]').is(':checked')) {
    $(this).prop('checked',true);
} else {
    $(this).prop('checked',false);
}

suraj rawat
la source

Nous pouvons éliminer if, sinon en utilisant une doublure, $ (this) .prop ('checked', $ ('input [type = checkbox]'). Is (': checked'));

Yousaf Hassan

8

Je recommande d'utiliser les deux, prop et attr car j'ai eu des problèmes avec Chrome et je l'ai résolu en utilisant les deux fonctions.

if ($(':checkbox').is(':checked')){
    $(':checkbox').prop('checked', true).attr('checked', 'checked');
}
else {
    $(':checkbox').prop('checked', false).removeAttr('checked');
}

Ragnar
la source

Oui, pour le chrome, utilisez: $("input[type='checkbox'], input[type='radio']").prop("checked", false).attr("checked", false).removeAttr("checked");

Rod

J'utilise un composant personnalisé (CSS + JS) pour remplacer la radio d'entrée et la case à cocher. C'est la seule façon qui fonctionne pour moi. Merci!

Silvio Delgado

3

Une autre alternative pour faire la même chose est de filtrer sur l' attribut type = checkbox :

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

ou

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

Rappelez-vous que la différence entre les attributs et les propriétés peut être importante dans des situations spécifiques. Avant jQuery 1.6 , la méthode .attr () prenait parfois en compte les valeurs de propriété lors de la récupération de certains attributs, ce qui pouvait entraîner un comportement incohérent. Depuis jQuery 1.6, la méthode .prop () fournit un moyen de récupérer explicitement les valeurs de propriété, tandis que .attr () récupère les attributs.

tonnoz
la source

2

La question était "Laquelle de ces réponses est la plus correcte?" Et non "Y a-t-il d'autres moyens de le faire?". Vous ne semblez pas avoir tenté de répondre à la question

Andrew Stubbs

.prop ('vérifié', faux) ou .removeAttr ('vérifié')?

Réponses: