Запускать javascript в атрибуте href с помощью jQuery .click () (или аналогичного)

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

Сторонние ссылки содержат javascript в атрибуте href, например:

<a id="horribleLink" href="javascript:doSomething()">Click me</a>

Мой прокси-элемент выглядит так:

<button rel="horribleLink" class="linkProxy">No, click me</button>

И немного javascript с jQuery, чтобы связать их вместе:

$('button.linkProxy').click(function(){
    $('#' + $(this).attr('rel')).click();
});

Теперь это отлично работает, если сторонняя ссылка просто стандартная ссылка (<a id="horribleLink" href="http://www.google.com">Click</a>) или чуть менее ужасный onclick (<a href="#" id="horribleLink" onclick="doSomething()">Click</a>), но когда javascript находится внутри атрибута href, запускается 'click' вообще ничего не делает.

Может ли кто-нибудь сказать мне, почему и есть ли разумное решение?

Обновлено. Как сказал Millimetric, основная причина заключается в том, что браузеры предотвращают «ложные клики» по привязкам - я удалил свой пример «стандартной ссылки», так как это другая ситуация, которая не работает. Однако обработчик onclick работает, как и следовало ожидать.


person Ben Hull    schedule 03.08.2011    source источник
comment
Для начала вы можете проверить синтаксис? onclick="doSomething() должно быть onclick="doSomething()"   -  person dugokontov    schedule 03.08.2011
comment
Разве href="javascript:doSomething" не должно быть href="javascript:doSomething()"?   -  person Rocket Hazmat    schedule 03.08.2011
comment
Исправлено - это были просто опечатки в моих примерах, а не реальный код.   -  person Ben Hull    schedule 03.08.2011


Ответы (5)


В принятом ответе здесь содержится немного подробностей относительно того, «почему это происходит»: Могу ли я вызвать jquery click (), чтобы перейти по ссылке ‹a›, если я не привязал к нему обработчик событий с помощью привязки или уже щелкнул ?. По сути, кажется, что вы не можете щелкнуть () по ссылке, потому что браузер не поддерживает поддельный щелчок.

Одно решение:

Если вы установите location.href для этих случаев, он работает:

$('button.linkProxy').click(function(){
    location.href = $('#' + $(this).attr('rel')).attr('href');
});

Рабочая скрипка: http://jsfiddle.net/uv29x/3/

Два обходных пути:

Вы могли бы просто получить href этих ссылок и сделать eval() над ними, верно?

person Milimetric    schedule 03.08.2011
comment
Я понимаю, что это ужасно с точки зрения безопасности, но установка вроде как заставляет вас делать это, я думаю. - person Milimetric; 03.08.2011
comment
Это обходной путь, который у меня есть на данный момент - он работает нормально, но мне тоже очень хотелось бы понять, что происходит. - person Ben Hull; 03.08.2011
comment
Принятый ответ здесь немного углублен: stackoverflow.com/questions/1694595/. По сути, кажется, что вы не можете сделать click() для ссылки, потому что браузер не поддерживает поддельные нажатия. - person Milimetric; 03.08.2011
comment
Я принимаю этот ответ, в основном из-за комментария выше. Думаю, я по-прежнему буду использовать eval вместо location.href, но оба обходных пути одинаково хороши (плохие / уродливые)! Спасибо за вашу помощь! - person Ben Hull; 03.08.2011
comment
np, я отредактирую этот комментарий в теле, так как он лучше отвечает на ваш первоначальный вопрос. - person Milimetric; 03.08.2011
comment
При этом у меня такое ощущение, что eval хуже, чем location.href = . Я не знаю почему, потому что это немного выше моей зарплаты. Джон Скит? Джон Ресиг? - person Milimetric; 03.08.2011
comment
Третье решение: jsfiddle.net/FKaYR (вставка <form> в документ, установка его действия), хотя это очень очень похоже на изменение location.href, давая его только как комментарий. - person Shadow Wizard Wearing Mask V2; 03.08.2011
comment
Насколько я могу судить, eval () с точки зрения безопасности не хуже, чем атрибут javascript: href. Любой, кто может передать что-то неприятное в eval, может так же легко переписать атрибут href и выполнить свой код таким образом. Думаю, у обоих методов одинаковые привилегии. - person Ben Hull; 04.08.2011
comment
+1 Биджамин. Просто зайдите в отладчик и введите все, что хотите. Да, это ужасно использовать в более или менее любом другом языке, но в js это честная игра, хотя и немного медленная. - person lededje; 16.04.2013
comment
Странно, раньше работала скрипка :) Вы должны создать новую с образцом кода и отредактировать ответ. Вот для чего нужны вики! - person Milimetric; 17.02.2017

Установите window.location на значение href.

$('button.linkProxy').click(function(){
    window.location = $('#'+$(this).attr('rel')).attr('href');
});

ДЕМО: http://jsfiddle.net/dmSUm/

person Rocket Hazmat    schedule 03.08.2011
comment
Интересный подход! Я понимаю, почему это работает, но мне он кажется еще неприятнее, чем метод eval. - person Ben Hull; 03.08.2011
comment
@Beejamin: Не знаю, какой метод лучше, я просто предпочитаю избегать eval. - person Rocket Hazmat; 03.08.2011
comment
небольшое исправление для размещения всех трех типов ссылок: jsfiddle.net/dmSUm/2 < / а> - person Joseph Marikle; 03.08.2011

Я как раз закончил набирать это, когда увидел ответ Milimetric. В любом случае, вот код того, что он стоит -

eval($('#horribleLink').attr('href').replace('javascript:',''));
person ipr101    schedule 03.08.2011
comment
Спасибо - это то, к чему я прибегал до того, как задал вопрос (наверное, я должен был упомянуть). Я надеюсь, что кто-то тоже знает почему. - person Ben Hull; 03.08.2011

Используйте собственный метод Javascript click, и у вас будет рабочий щелчок!

$('button.linkProxy').click(function(){
    $('#' + $(this).attr('rel')).click()[0].click();
});

Я сохранил jQuery click предполагая, что Javascript click будет обходить jQuery triggers, и в этом случае вы захотите сохранить оба. В противном случае, если я ошибаюсь (или вам не нужно учитывать trigger), вы можете уменьшить его до:

$('button.linkProxy').click(function(){
    $('#' + $(this).attr('rel'))[0].click();
});
person Nathan J.B.    schedule 10.12.2014

Если я правильно понял вопрос, проблема в том, что у вас что-то вроде этого:

 <a href="javascript:alert('hello');" onclick="javascript:alert('clicked');">Test</a>

И вы утверждаете, что когда javascript находится в href, событие onclick не запускается. Правильный? Если да, то я вижу, что оба увольняются, сначала onclick, а затем javascript внутри href.

person Icarus    schedule 03.08.2011
comment
Это совсем не проблема. Проблема в том, что он пытается вызвать действие href из другой функции JavaScript. - person Rocket Hazmat; 03.08.2011
comment
Нет - ссылки, с которыми я работаю, не имеют onclick, только javascript внутри href. Он не срабатывает, когда событие щелчка запускается программно. - person Ben Hull; 03.08.2011
comment
@Beejamin Я понимаю, что ты имеешь в виду. - person Icarus; 03.08.2011