web-dev-qa-db-ja.com

HTMLでhrefの代わりにJavaScript関数を呼び出す方法

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)

動作しているfirebugでこれを行いたい場合、ブラウザのURLを意味します。今私はそれをしたいのですが、誰かがリンクをクリックすると、ブラウザはブラウザでそれらを開くのではなく、DOMにすでにロードされている関数を呼び出そうとします。

73
user605334

その構文は正常に機能するはずですが、この代替手段を試すことができます。

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

または

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

「クリックイベントハンドラ」としてのみ使用する場合は、代わりに<button>を使用します。リンクには特定の意味上の意味があります。

例えば。:

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

JavaScriptを目立たないようにしてください:

  • href属性で実際のリンクを使用する必要があります
  • クリックイベントにリスナーを追加してajaxを処理します
6
soju
href="#" onclick="javascript:ShowOld(2367,146986,2)
4
nico

スパンで小さな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");
}
4
tolsen64

また、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;

これにより、ブラウザでリンクが開かなくなります。

3
hellsgate