jQueryの「javascript:void(0);」、「return false」、および「preventDefault()」の違いと使い方


まず、「javascript:void(0);」は、通常、HTMLのリンク(<a>要素)のhref属性に設定される値です。この値を指定することで、クリックした際にページがリロードされないようにします。この方法は古いやり方であり、現代のjQueryでは推奨されません。代わりに、以下の方法を使用することをおすすめします。

  1. 「return false」: イベントハンドラ内でreturn false;を使用することで、デフォルトのブラウザの動作をキャンセルします。具体的には、リンクのクリックによるページ遷移を防止します。例えば、次のように書くことができます。
$('a').click(function() {
  // 何らかの処理

  return false;
});
  1. 「preventDefault()」: イベントオブジェクトのpreventDefault()メソッドを使用することで、イベントのデフォルトの動作をキャンセルします。これは、jQueryのイベントハンドラ内でよく使用されます。例えば、次のように書くことができます。
$('a').click(function(event) {
  // 何らかの処理

  event.preventDefault();
});

注意点としては、preventDefault()はイベントオブジェクトが必要ですが、return falseは必要ありません。また、return falseを使用すると、イベントの伝播(バブリング)も防止されますが、preventDefault()はイベントの伝播には影響を与えません。

以上のように、「return false」と「preventDefault()」は、リンクのクリックによるデフォルトの動作をキャンセルするために使用されます。どちらを使用するかは好みの問題ですが、一般的にはpreventDefault()の使用が推奨されています。