Как передать массив в атрибут jQuery .data ()

86

Хорошо, поэтому я хочу передать очень простой массив в серверную часть данных jquery, например:

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

а затем вернуться вот так:

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

alert(stuff[0]);

Почему появляется предупреждение "[", а не "a" (см. Ссылку JSfiddle)

Ссылка JSFiddle: http://jsfiddle.net/ktw4v/3/

— Wilsonpage
источник

144

Он обрабатывает вашу переменную как строку, нулевым элементом которой является [.

Это происходит потому, что ваша строка недействительна в формате JSON , поэтому в качестве разделителя строк следует использовать двойные кавычки вместо одинарных. Затем вам нужно будет использовать одинарные кавычки, чтобы ограничить все значение атрибута.

Если вы исправите кавычки, ваш исходный код будет работать (см. Http://jsfiddle.net/ktw4v/12/ )

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

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

Когда jQuery видит действительный JSON в атрибуте данных, он автоматически распаковывает его для вас .

— Альнитак
источник

5

infact, ['a', 'b', 'c'] НЕ является действительным JSON;)

— stecb

2

['a', 'b', 'c'] недопустимый JSON

— Mutt

Как должен выглядеть JSON?

— wilsonpage

5

Он должен использовать двойные кавычки, но тогда вам придется использовать одинарные кавычки, чтобы заключить атрибут HTML.

— Альнитак

1

@JoeBrockhaus они оба являются разделителями - кавычки - это «разделители строк», а запятые - «разделители записей». Только первые имеют отношение к вопросу ОП.

— Alnitak

15

Объявление его как атрибута означает, что это строка.

Это stuff[0]было бы эквивалентно:var myString = "['a','b','c']"; alert(myString[0]);

Вам нужно, чтобы это выглядело так:

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

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

Отзыв: синтаксический анализ jQuery не выполняется, потому что он не соответствует правилам parseJSON.

Однако я буду поддерживать свое решение. Есть аспекты других, которые далеки от идеала, так же как и это решение в некоторых отношениях далеко не идеально. Все зависит от ваших парадигм.

— Джон Грин
источник

4

нет, объявление его недействительным JSON означает, что он обрабатывается как строка.

— Альнитак

@Alnitak - Хотя это вполне может быть способ, которым jQuery обрабатывает это - я не вижу этого в справочнике jQuery Api, и это, безусловно, не ясно в спецификации w3c. Поскольку определение JSON в dom-объекте нарушит «нейтралитет» w3c, это похоже на расширение jQuery или, с учетом отсутствия документации, на причуду. В любом случае, хотя я не могу сказать, что согласен с вами в этом вопросе, я не настолько зол, что собираюсь удалить ваш первый +1, который вы получили. :)

— Джон Грин

@John это будет документировано в API JQuery - «Каждая попытка преобразовать строку в значение JavaScript (это включает в себя булевы, числа, объекты, массивы и нуль) в противном случае она остается в виде строки.»

— Альнитак

@Alnitak Тогда я под кайфом, потому что я прочитал почти весь раздел данных и многие комментарии перед публикацией. Я просто посмотрел еще раз.

— Джон Грин

@Alnitak хорошо, я нашел это из вашего редактирования. Да, это расширение JQuery. Я поправлю свой пост.

— Джон Грин

-2

Как определили другие, значение обрабатывается как строка, поэтому оно возвращает "[". Пожалуйста, попробуйте это (aaa - это имя div, и я вынул данные):

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

— Раджа
источник

-4

Другой подход размещен на jsfiddle ; var stuff = $('div').data('stuff');материал - это строка с 0-м символом как '['

Ну, var stuff = eval($('div').data('stuff'));должен получить вам массив

— Mayank
источник

3

eval - это зло :) Всегда есть способ лучше

— БАЙТ РАЙДЕР

Измените свой ответ так, чтобы сказать, что, хотя это возможное решение, eval () может привести к смерти единорогов ... stackoverflow.com/questions/86513/…

— Just Plain High