Использование jQuery внутри тега href

Question

Я пытаюсь найти способ вызвать оператор jQuery из тега <a> в атрибуте href. Мой код выглядит следующим образом:

<a href="javascript:$('#myElement').addClass('test');"> 

При нажатии на эту ссылку в браузере (Firefox) выходит на пустую страницу с:

[object Object] 

ВАЖНО: Я использую плагин третьей стороной, которая генерирует код метки привязки, поэтому у меня нет доступа для добавления кода в событие onclick для тега <a>. Я также предпочел бы не вводить функцию в качестве оболочки для оператора, поскольку мы используем AJAX.

Самое смешное, что это работает:

<a href="javascript:alert('test');"> 

Есть причина, почему заявления JQuery не работает в атрибуте href? Это главный знак доллара, вызывающий проблемы? Есть ли способ заставить его работать?

Answer 1

Возвращаемое значение javascript: URI - это данные, используемые для составления страницы, на которую должен перейти браузер.

Вызов объекта jQuery будет возвращать объект jQuery. Вызов alert будет возвращен undefined (который рассматривается как ответ «Нет содержимого»).

Вы можете обернуть сценарий в вызове void() (передавая значение возвращаемое jQuery в качестве аргумента к нему), но я бы очень советую разобраться в основной системе, так что вы не должны использовать javascript: идентификаторы URI в первое место.

Answer 2

Вы можете обойти эту проблему, обернув вызов функции:

<a href="javascript:(function(){$('#myElement').addClass('test');})()">asdf</a> 

Но лучше ставка с помощью событий JavaScript Клик:

<a href="#" onclick="$('#myElement').addClass('test');return false;">asdf</a> 

или даже лучше, зацепив в другом месте:

<a href="#" id="somelink">asdf</a> 

jQuery(document).ready(function() { 
    jQuery("#somelink").click(function() { 
     $('#myElement').addClass('test'); 
     return false; 
    }); 
});