Définition dynamique d'une valeur pour les attributs de données à l'aide de jquery

Question

J'utilise de manière intensive les attributs de données pour la gestion des données dans les événements côté client. Est-il possible d'attribuer dynamiquement une valeur à un attribut de données en utilisant javascript ou jquery?

<li data-class_value="somevalue" class="myclass"></li> 


$('.myclass').click(function(){ 
    $(this).data('class_value') = "new value"; 
}); 

Le code javascript ci-dessus jette l'erreur:

"Uncaught ReferenceError: Invalid left-hand side in assignment".

Quelqu'un pourrait-il s'il vous plaît me dire comment cela peut être réalisé?

Answer 1

Vous devez faire

$(this).data('class_value', "new value"); 

Answer 2

$(this).data('class_value','new value') ;

.data

Answer 3

Je crois que les réponses ci-dessus ne ferait que définir l'objet de données sur cet élément au sein de jQuery.

Si vous devez définir l'attribut HTML Data- réelle *, vous auriez besoin d'utiliser ceci:

$(this).attr("data-class_value", "new value"); 

Méfiez-vous de la récupération HTML5 Data- * attributs de cette façon aussi, que bien que vous pouvez utiliser le raccourci $(this).data("class_value"); pour les récupérer, les extractions suivantes utiliseront la valeur mise en cache dans l'objet de données jQuery.

De l'jQuery docs:

The data- attributes are pulled in the first time the data property is accessed and then are no longer accessed or mutated (all data values are then stored internally in jQuery).

Source: jQuery caching of data attributes