Как вызвать функцию JavaScript вместо href в HTML

86

У меня есть макет в HTML

<a href="javascript:ShowOld(2367,146986,2)"><img title="next page" alt="next page" src="/themes/me/img/arrn.png"></a>

Я получил ответ от сервера, когда отправил запрос.

С этим макетом я получил ответ на запрос AJAX, который отправляет мой код на сервер.

Что ж, все в порядке, но когда я нажимаю на ссылку, браузер хочет открыть функцию как ссылку; это означает, что после щелчка я вижу адресную строку как

javascript:ShowOld(2367,146986,2)

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

javascript html debugging

— Бретт ДеВуди
источник

На аналогичный вопрос отвечает сам Stackoverflow. stackoverflow.com/questions/1070760/…

— Скария Себастьян 08

192

Этот синтаксис должен работать нормально, но вы можете попробовать эту альтернативу.

<a href="javascript:void(0);" onclick="ShowOld(2367,146986,2);">

или

<a href="javascript:ShowOld(2367, 146986, 2);">

ОБНОВЛЕННЫЙ ОТВЕТ НА СТРОЧНЫЕ ЗНАЧЕНИЯ

Если вы передаете строки, используйте одинарные кавычки для параметров вашей функции.

<a href="javascript:ShowOld('foo', 146986, 'bar');">

— Голландцы432
источник

Как передать строку, избегая двойных кавычек в аргументах? H = В примере только целые числа.

— Джеффри Коппс 07

1

@jeffrycopps попробуйте одинарные кавычки внутри вашей функции

— ineedme

@ineedme Ответ Обновлено с учетом этой информации. Спасибо.

— Dutchie432

9

Если у вас есть только «обработчик события щелчка», используйте <button>вместо него. Ссылка имеет особое семантическое значение.

Например:

<button onclick="ShowOld(2367,146986,2)">
    <img title="next page" alt="next page" src="/themes/me/img/arrn.png">
</button>

— Феликс Клинг
источник

Есть ли способ сделать кнопку похожей на ссылку вместо кнопки?

— Бен Пейдж

@ Бен Пейдж: Да, с помощью CSS. По крайней мере, у вас есть хорошее приближение. См. Мой ответ и комментарии здесь: stackoverflow.com/questions/4842953/or-javascriptvoid0/…

— Феликс Клинг,

7

Постарайтесь сделать свой javascript ненавязчивым:

вы должны использовать настоящую ссылку в атрибуте href
и добавьте прослушиватель события щелчка для обработки ajax

— соджу
источник

hrefне является обязательным, просто опустите его.

— Колин т Харт,

Тег - это якорь; у него не обязательно должна быть ссылка.

— Колин Т Харт,

5

Я использую немного CSS для диапазона, чтобы он выглядел как ссылка:

CSS:

.link {
    color:blue;
    text-decoration:underline;
    cursor:pointer;
}

HTML:

<span class="link" onclick="javascript:showWindow('url');">Click Me</span>

JAVASCRIPT:

function showWindow(url) {
    window.open(url, "_blank", "directories=no,titlebar=no,toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes");
}

— tolsen64
источник

Вышеупомянутый параметр функции 'url' дает мне строку "url" вместо фактического url

— visrahane

Вы должны поместить фактический URL в функцию showWindow. Например: javascript: showWindow (' stackoverflow.com' );

— tolsen64 04

Я не могу жестко

— запрограммировать

3

Вы также должны отделить javascript от HTML.
HTML:

<a href="#" id="function-click"><img title="next page" alt="next page" src="/themes/me/img/arrn.png"></a>

javascript:

myLink = document.getElementById('function-click');
myLink.onclick = ShowOld(2367,146986,2);

Просто убедитесь, что последняя строка в функции ShowOld:

return false;

так как это остановит открытие ссылки в браузере.

— врата ада
источник

hrefне является обязательным, просто опустите его.

— Колин т Харт,

3

<a href="#" onclick="javascript:ShowOld(2367,146986,2)">

— Нико
источник

8

Не лучшее решение, так как это приведет к переходу в начало страницы.

— Alex Marshall

Для href вместо #использованияhref="javascript:void(0)

— Narayan

hrefне является обязательным, просто опустите его.

— Колин т Харт,

1

hrefне является обязательным для aэлементов.

Вполне достаточно использовать

<a onclick="ShowOld(2367,146986,2)">link text</a>

— Колин т Харт
источник