Comment passer un tableau dans l'attribut .data() de jQuery ?

Question

Ok donc je veux passer un tableau très basique dans un attrubute de données jquery côté serveur comme ceci :

<div data-stuff="['a','b','c']"></div>

et ensuite de retraiter comme ça :

var stuff = $('div').data('stuff');

alert(stuff[0]);

Pourquoi cela semble-t-il alerter "[" et non "a" (voir le lien JSfiddle) ?

Lien JSFiddle : http://jsfiddle.net/ktw4v/3/

Answer 1

Il traite votre variable comme une chaîne de caractères, dont l'élément zéro est [ .

Cela se produit parce que votre chaîne n'est pas JSON valide qui devrait utiliser les guillemets doubles comme délimiteur de chaîne au lieu des guillemets simples. Vous devrez alors utiliser des guillemets simples pour délimiter l'ensemble de la valeur de l'attribut.

Si vous corrigez vos guillemets, votre code original fonctionne (voir http://jsfiddle.net/ktw4v/12/ )

<div data-stuff='["a","b","c"]'> </div>

var stuff = $('div').data('stuff');

Lorsque jQuery voit du JSON valide dans un attribut de données, il va le déballer automatiquement pour vous .

Answer 2

Le fait de le déclarer comme un attribut signifie qu'il s'agit d'une chaîne de caractères.

Alors stuff[0] serait équivalent à : var myString = "['a','b','c']"; alert(myString[0]);

Tu dois faire en sorte que ça ressemble à ça :

<div data-stuff="a,b,c"></div>

var stuff = $('div').data('stuff').split(',');
alert(stuff[0]);

---

Rétraction : l'analyse de jQuery échoue parce qu'elle ne respecte pas les règles de parseJSON.

Cependant, je m'en tiendrai à ma solution. Il y a des aspects des autres solutions qui sont moins qu'idéaux, tout comme cette solution est moins qu'idéale à certains égards. Tout dépend de ce que sont vos paradigmes.

Answer 3

Comme d'autres l'ont indiqué, la valeur est traitée comme une chaîne de caractères et renvoie donc "[". Essayez ceci (aaa est le nom de la division et j'ai enlevé les données) :

$(function(){
    $.data($("#aaa")[0],"stuff",{"aa":['a','b','c']});
    var stuff = $.data($("#aaa")[0],"stuff").aa;
    alert(stuff[0]); //returns "a"
});

Answer 4

Une approche différente est affichée à jsfiddle ; var stuff = $('div').data('stuff'); stuff est une chaîne de caractères dont le 0e caractère est '['

Bien, var stuff = eval($('div').data('stuff')); devrait vous donner un tableau