Как передать данные с помощью ajax-методов jQuery на события / ссылки кликов?

Question

Используя javascript «старой школы», вы указали бы идентификатор в качестве параметра во встроенном вызове функции (onclick="my_function(28)" или аналогичный) с идентификатором, предоставленным вашим кодом на стороне сервера.

Используя javascript 'new school', вызов функции абстрагируется от элемента, так как передать идентификатор?

Мое предположение:

<a id="28" class="do-something" href="#">Do something</a>

$('a.do-something).click(function(event){

  element_id = $(this).attr('id');

  $.get('something.php', { id: element_id });

  return false;

});

Существует ли соглашение или передовой опыт, который вы используете / видели?

[Обновление: добавлен возврат false; ]

Answer 1

Обычно для чего-то подобного я просто использую HREF для хранения URL, который должен использовать обработчик jQuery:

<a class="do-something" href="something.php?id=28">Do something</a>

$('a.do-something).click(function(event){
  $.get($(this).attr('href'));
  return false;
});

Таким образом, идентификатор все еще может быть рядом, если он вам нужен для CSS. Кроме того, если вам нужно несколько параметров для отправки в функцию php, вам не о чем беспокоиться, все это часть URL, как обычно.

Возвращаемое значение false не позволяет браузеру фактически переходить по ссылке при нажатии на нее.

Answer 2

Ответ Parrots лучше всего подходит для этого конкретного случая: если вы используете ссылку, href должен указывать на то, что полезно для пользователей, не поддерживающих JavaScript, и для людей, которые открывают ссылку с помощью щелчка средней кнопкой мыши или закладки правой кнопкой мыши или что угодно.

Если у вас нет пункта назначения для ссылки, вам не следует использовать ссылку. Вы можете использовать span, как SO ), рестайлинговая кнопка.

Однако в общем случае вам иногда нужно включать дополнительные данные, которые не вписываются в существующий атрибут, такой как href. Иногда это может быть в id, но тогда вы немного ограничены используемыми персонажами. Например, ваш код является недействительным HTML, потому что идентификаторы не могут начинаться с цифры. Для числовых идентификаторов вы можете попробовать id="foo-28" и извлечь номер из кода.

Или вы можете начать помещать несколько параметров в имена классов (class="foo-28 bar-16a") и использовать функцию JS для разделения, сопоставления именованного префикса и возврата остальных. Большинство символов допускаются в имени класса, но, конечно, вы не можете использовать другой пробел. (Вы также можете кодировать его некоторым способом в className, например, URL-encode.)

Или вы можете поместить комментарий внутри элемента и использовать методы DOM, чтобы получить объект комментария и извлечь его данные. Вы можете поместить в него JavaScript / JSON, например ::

<span class="do-something"><!-- {foo: 28, bar: '16a'} --> Something </a>

Или вы можете использовать атрибуты HTML5 data-. Или (... несколько других вариантов ...)