☰

JavaScript - ハイパーリンクのコールバック関数の href と onclick の比較 質問する

tag-icon • tag-icon javascript
JavaScript - ハイパーリンクのコールバック関数の href と onclick の比較 質問する

リダイレクトなしでクリック時に単純な JavaScript 関数を実行したいです。

href次のように、JavaScript 呼び出しを属性内に配置する場合と、JavaScript 呼び出しを属性内に配置する場合とで、何か違いや利点はありますか。

<a href="javascript:my_function();window.print();">....</a>

属性に配置するonclick（イベントにバインドするonclick）のとどちらが良いでしょうか?

ベストアンサー1

悪い： 

<a id="myLink" href="javascript:MyFunction();">link text</a>

良い： 

<a id="myLink" href="#" onclick="MyFunction();">link text</a>

より良い： 

<a id="myLink" href="#" onclick="MyFunction();return false;">link text</a>

さらに良い1: 

<a id="myLink" title="Click to do something"
 href="#" onclick="MyFunction();return false;">link text</a>

さらに良い2: 

<a id="myLink" title="Click to do something"
 href="PleaseEnableJavascript.html" onclick="MyFunction();return false;">link text</a>

なぜ良いのか？return falseブラウザがリンクをたどるのを防ぐためです

最高：

jQuery または他の同様のフレームワークを使用して、要素の ID によって onclick ハンドラーをアタッチします。

$('#myLink').click(function(){ MyFunction(); return false; });

おすすめ記事