web-dev-qa-db-fra.com

removeData () La méthode jQuery ne fonctionne pas

Je pense que j'utilise correctement removeData mais cela ne semble pas fonctionner. Voici ce que je vois dans la console de développement. Quelqu'un pourrait-il expliquer ce que je fais mal?

Je suis en train de sortir la valeur actuelle de l'attribut de données, en appelant removeData, puis en sortant à nouveau la valeur et sa toujours là.

$('.questionList > li').eq(1).data('fieldlength')
3
$('.questionList > li').eq(1).removeData('fieldlength');
[
<li class=​"questionBox" data-createproblem=​"false" data-fieldlength=​"3" data-picklistvalues data-required=​"true" data-sfid=​"a04d000000ZBaM3AAL" data-type=​"Text">​
<div class=​"questionLabel">​Birthdate​</div>​
</li>​
]
$('.questionList > li').eq(1).data('fieldlength')
3
jquerycustom-data-attribute
23
turbo2oh

C'est parce que votre data provient de l'attribut HTML data-fieldlength. Selon les docs :

Lorsque vous utilisez .removeData ("name"), jQuery tentera de localiser un data - attribut sur l'élément si aucune propriété de ce nom n'est dans le cache de données interne. Pour éviter une nouvelle interrogation de l'attribut data, définissez le nom avec une valeur nulle ou non définie (par exemple .data ("nom", non défini)) plutôt que d'utiliser .removeData ().

Donc au lieu de

$('.questionList > li').eq(1).removeData('fieldlength');

tu devrais faire

$('.questionList > li').eq(1).data('fieldlength',null);
27
Blazemonger

Je voulais clarifier quelque chose au cas où quelqu'un d'autre tomberait dessus ...

Si vous avez des attributs HTML5 data-* sur un élément, vous devez utiliser la fonction removeAttr() de jQuery au lieu de removeData() si vous souhaitez les supprimer de l'élément dans le DOM.

Par exemple, pour supprimer un attribut de données d’un élément, vous devez utiliser:

$({selector}).removeAttr('data-fieldlength');

Vous pouvez lire des valeurs comme celle-ci avec $({selector}).data('fieldlength'), mais removeData() ne les supprime pas réellement s'il s'agit d'attributs HTML sur un élément présent dans le source de la page (il le supprime simplement en mémoire, de sorte que si vous l'interrogez à nouveau avec jQuery il semble avoir été supprimé).

Personnellement, je pense que ce comportement est cassé et je suis sûr qu'il attire beaucoup de monde.

31
Iain Collins

Dans le champ masqué utilisant l'attribut de données personnalisé pour stocker les données d'objet 

2
Sandesh Chavan

En fait, cela fonctionne mieux pour moi. Parce qu'il laisse l'attribut intact dans l'élément mais sans valeur assignée.

$(selector).attr("data-fieldlength","");
1
Gardoku

.removeData() sera supprimera uniquement les données du cache .data() interne de jQuery afin que les attributs data- correspondants sur l'élément ne soient pas supprimés. Un appel ultérieur à data() récupérera donc la valeur de l'attribut data- de l'élément. Pour éviter cela, utilisez .removeAttr() aux côtés de .removeData() pour supprimer également l'attribut data-.

Exemple:

$('div').removeData('info');
$('div').removeAttr('data-info');

Puis définissez soit:

$('div').data('info', 222);
$('div').attr('data-info', 222);
0
ztrat4dkyle