Comment basculer l'attribut de données avec jQuery?

J'ai besoin de basculer entre les deux valeurs possibles pour un attribut de données.

Si data-state est égal à enabled alors je veux le changer pour disabled et vice versa.

$('.sites .state').on('ajax:success', function(data, status, xhr) {
   var site = $(this).parents('article').first();

   if (site.data('state') == 'enabled') {
     site.attr('data-state', 'disabled');
   } else {
     site.attr('data-state', 'enabled');
   }
});

REMARQUE: j'avais besoin de changer l'élément du DOM et à ma connaissance, je ne peux pas utiliser data de le faire (d'où l'utilisation de attr).

Quel est donc le problème?
Voir ma mise à jour. J'avais besoin de changer l'élément du DOM et, à ma connaissance, je ne peux pas utiliser les données pour le faire (d'où l'utilisation de l'attribut).

OriginalL'auteur Shpigford | 2013-01-23

  1. 7
    site.attr('data-state', 'disabled');

    Devrait être

    site.data('state', 'disabled');

    Lorsqu'un élément est créé le data-<value> attribut peut être utilisé dans initialiser les données de propriété, mais après cela, vous devez utiliser le jQuery.de données() méthode pour récupérer ou modifier les données.

    Tout $(el).data('<data-name>') renvoie la valeur, $(el).data('<data-name>', value) définir la valeur de données.

    Mise à jour: Basé sur la mise à jour exigence

    $('div').attr('data-state', $('div').attr('data-state') == 'enabled' ? 'disabled' : 'enabled')

    Violon

    J'avais besoin de changer l'élément du DOM et, à ma connaissance, je ne peux pas utiliser data de le faire (d'où l'utilisation de attr).
    mise à jour de la réponse

    OriginalL'auteur Arun P Johny

  2. 4

    Pas vraiment sûr de ce qui est le problème, mais depuis que vous êtes à l'aide de .data() vous pouvez ainsi continuer à l'utiliser dans votre si/d'autre. Faire .attr('data-state') il enregistre sur l'élément DOM lui-même (visible lorsque vous inspecter l'élément), alors qu'avec .data('state') il est invisible, et aussi plus rapide.

    Aussi, si vous utilisez l'opérateur ternaire vous pouvez en faire 1 petite ligne:

    site.attr('data-state', site.data('state') === 'enabled' 
    ? 'disabled' 
    : 'enabled');
    J'avais besoin de changer l'élément du DOM et, à ma connaissance, je ne peux pas utiliser les données pour le faire (d'où l'utilisation de l'attribut).
    Ah ok, mis à jour pour commencer site.attr(

    OriginalL'auteur Mark Pieszak - Trilon.io

  3. 2
    site.data('state', (site.data('state') == 'enabled' ? 'disabled' : 'enabled'))

    OriginalL'auteur Robin Maben