Передача большого количества данных из одного тега привязки

#javascript #jquery #object

#javascript #jquery #объект

Вопрос:

Каков наилучший способ передачи большого количества данных по одной ссылке? Является ли что-то подобное хорошей идеей или есть способ получше?

 <a href="{ 'id':'1', 'foo':'bar', 'something':'else' }" id="myLnk" > Click </a>


$('#myLnk).click( function(event){
  event.preventDeafult();
  var data = $(this).attr('href')
  console.log( $.parseJSON( response ) );

})
  

Спасибо!

Комментарии:

1. Чтобы получить наилучший возможный ответ, не могли бы вы предоставить нам немного больше контекста? Объясните подробнее, что происходит с этим кодом, как я визуализировал данные и для чего они используются.

2. @Ancide, это просто общий вопрос. На самом деле я не пытаюсь сделать что-то конкретное. Просто интересно, какова наилучшая практика.

3. Хорошо, почему мне интересно, это просто потому, что в этом случае в зависимости от контекста возможны разные ответы. Который работает лучше в зависимости от контекста.

Ответ №1:

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

Например:

 <a href="#" data-json="{ 'id':'1', 'foo':'bar', 'something':'else' }">Click</a>
  

Затем вы можете легко получить доступ к этим данным из своего JavaScript, используя функцию jQuery data().

Или, вместо того, чтобы объединять все данные в одном блоке JSON, вы можете разделить их на отдельные атрибуты:

 <a id="myLnk"
    data-id="1"
    data-foo="bar"
    data-something="else">
  

Затем их можно извлечь с помощью jQuery следующим образом:

 $("#myLnk").data("id")
$("#myLnk").data("foo")
$("#myLnk").data("something")
  

Комментарии:

1. Спасибо Крису (и html5), это именно то, что я искал.

2. Крис, смотри мою заметку ниже для $.data()… На самом деле, я только что узнал об этом сам.

3. есть ли способ опубликовать данные на другой странице? или это просто для просмотра данных на одной странице?

Ответ №2:

Рекомендуемый способ — использовать атрибуты HTML5 data-* :

 <a href="#" id="myLnk" data-id="1" data-foo="bar" data-something="else">Click</a>
  

Ответ №3:

Чтобы добавить к ответам Криса и MvChr, вы также можете сделать это, хотя я ненавижу использовать одинарные кавычки для атрибутов:

 <a href='#' data-json='{ "id":1, "foo":"bar", "something":"else" }'>Click</a>
  

Причина такого синтаксиса в том, что, если вы правильно заключите его в кавычки, $.data в jQuery будет работать автоматически. В противном случае вам придется использовать $.parseJSON($.data(селектор)) для получения информации.