Come passare un array nell'attributo jQuery .data ()

86

Ok, quindi voglio passare un array molto semplice in un lato server di attrubute di dati jquery in questo modo:

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

e poi recuperare in questo modo:

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

alert(stuff[0]);

Perché questo sembra avvisare "[" e non "a" (vedi link JSfiddle)

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

— wilsonpage
fonte

145

Tratta la tua variabile come una stringa, il cui elemento zero è [.

Ciò accade perché la tua stringa non è JSON valido , che dovrebbe utilizzare virgolette doppie come delimitatori di stringa anziché virgolette singole. Dovrai quindi utilizzare virgolette singole per delimitare l'intero valore dell'attributo.

Se aggiusti le virgolette, il codice originale funziona (vedi http://jsfiddle.net/ktw4v/12/ )

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

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

Quando jQuery vede un JSON valido in un attributo di dati, lo decomprimerà automaticamente per te .

— Alnitak
fonte

5

infatti, ['a', 'b', 'c'] NON è un JSON valido;)

— stecb

2

['a', 'b', 'c'] non è JSON valido

— Mutt

Come dovrebbe essere il JSON?

— wilsonpage

5

Dovrebbe usare virgolette doppie, ma poi dovresti usare virgolette singole per racchiudere l'attributo HTML.

— Alnitak

1

@JoeBrockhaus sono entrambi delimitatori: le virgolette sono "delimitatori di stringa" e le virgole sono "delimitatori di record". Solo i primi sono rilevanti per la domanda del PO.

— Alnitak

15

Dichiararlo come un attributo significa che è una stringa.

Quindi stuff[0]sarebbe equivalente a:var myString = "['a','b','c']"; alert(myString[0]);

Devi farlo sembrare così:

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

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

Ritiro: l'analisi di jQuery non riesce perché non ha soddisfatto le regole di parseJSON.

Tuttavia, starò dietro la mia soluzione. Ci sono aspetti degli altri che sono tutt'altro che ideali, così come questa soluzione è meno che ideale per certi versi. Tutto dipende da quali sono i tuoi paradigmi.

— John Green
fonte

4

no, dichiararlo come JSON non valido significa che viene trattato come una stringa.

— Alnitak

@ Alnitak - Anche se potrebbe essere il modo in cui jQuery lo tratta - non lo vedo nel riferimento a jQuery Api, e sicuramente non è chiaro nelle specifiche w3c. Poiché la definizione di JSON in un oggetto dom violerebbe la "neutralità" del w3c, questa sembra essere un'estensione jQuery o, data la mancanza di documentazione - stranezza. In ogni caso, anche se non posso dire di essere d'accordo con te su questo punto, non sono così irritato che ho intenzione di rimuovere quel primo +1 che hai ottenuto. :)

— John Green

@ John è documentato nell'API jQuery - "Viene fatto ogni tentativo per convertire la stringa in un valore JavaScript (questo include booleani, numeri, oggetti, array e null) altrimenti viene lasciata come una stringa."

— Alnitak

@Alnitak Allora sono in alto, perché ho letto praticamente l'intera sezione dei dati e molti dei commenti prima di postare. Ho solo guardato di nuovo anche.

— John Green

@ Alnitak ok, l'ho trovato dalla tua modifica. Sì, questa è un'estensione Jquery. Modificherò il mio post.

— John Green,

-2

Come altri hanno identificato, il valore viene trattato come una stringa, quindi restituisce "[". Per favore prova questo (aaa è il nome del div e ho eliminato i dati):

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

— Raja
fonte

-3

Un approccio diverso è pubblicato su jsfiddle ; var stuff = $('div').data('stuff');roba è una stringa con 0 ° carattere come "["

Bene, var stuff = eval($('div').data('stuff'));dovrebbe procurarti un array

— Mayank
fonte

3

eval is evil :) c'è sempre un modo migliore

— BYTE RIDER

Per favore modifica la tua risposta per dire che, sebbene una possibile soluzione, eval () potrebbe causare la morte degli unicorni ... stackoverflow.com/questions/86513/…

— Just Plain High