Jak wywołać funkcję JavaScript zamiast href w HTML

Mam makietę w HTML

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

Otrzymałem odpowiedź z serwera, kiedy wysłałem żądanie.

Z tą makietą otrzymałem jako odpowiedź na żądanie AJAX, które wysyła mój kod do serwera.

Cóż, wszystko jest w porządku, ale kiedy klikam łącze, przeglądarka chce otworzyć funkcję jako łącze; czyli po kliknięciu widzę pasek adresu jako

javascript:ShowOld(2367,146986,2)

oznacza rzecz przeglądarki, która jest adresem URL, jeśli chcę to zrobić w programie firebug, który działa. Teraz chcę to zrobić, a gdy ktoś kliknie łącze, przeglądarka próbuje wywołać funkcję już załadowaną w DOM, zamiast próbować otworzyć ją w przeglądarce.

Ta składnia powinna działać poprawnie, ale możesz wypróbować tę alternatywę.

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

lub

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

ZAKTUALIZOWANA ODPOWIEDŹ NA WARTOŚCI STRINGOWE

Jeśli przekazujesz ciągi znaków, użyj apostrofów jako parametrów funkcji

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

Jeśli masz tylko „moduł obsługi zdarzeń kliknięcia”, użyj <button>zamiast tego. Link ma określone znaczenie semantyczne.

Na przykład:

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

Postaraj się, aby Twój javascript nie rzucał się w oczy:

• powinieneś użyć prawdziwego linku w atrybucie href
• i dodaj odbiornik po kliknięciu, aby obsłużyć ajax

Używam trochę CSS na rozpiętości, aby wyglądało jak łącze:

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");
}

Należy również oddzielić kod javascript od kodu 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);

Upewnij się tylko, że ostatnia linia w funkcji ShowOld to:

return false;

ponieważ spowoduje to zatrzymanie otwierania łącza w przeglądarce.

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

hrefjest opcjonalne dla aelementów.

W zupełności wystarczy

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