JavaScriptの「javascript:void(0)」の使い方

1年 ago
綾乃, 一希
1 minute

JavaScriptでは、javascript:void(0)という特殊な式があり、リンクやボタンの「無効」状態を表すために使用されます。その主目的は、リンクやボタンがクリックされても何も起きないことです。

２つで構成されています。

  1. これは偽の規約であり、ブラウザに対して後続する内容はJavaScriptコードであると伝えていない。
  2. void(0) は JavaScript の関数で、未定義の値を返します。ここでは undefined を返しています。

javascript:void(0)が一般的に使われるのは、タグのhref属性で、リンクがクリックされても新しいページに移動しないようにする場合です。例：

<a href="javascript:void(0)">点击我</a>

上記の例では、ユーザーがそのリンクをクリックしても何も起こりません。これは javascript:void(0) が実際には JavaScript コードを実行しないからです。

イベントハンドラでJavaScript:void(0)を使用するのも一般的な使用例で、デフォルトの動作が発生するのを抑えます。例えば：

document.getElementById("myButton").addEventListener("click", function(event) {
event.preventDefault(); // 阻止按钮的默认行为
// 执行其他的 JavaScript 代码
});

上の例では、ボタンがクリックされた場合、javascript:void(0) はボタンの標準的な動作を停止し、その後に他の JavaScript コードを実行できるようにするものです。

なお、javascript:void(0) は、ブラウザのアドレスバーに「javascript:void(0)」と表示され、ユーザーに混乱を与える可能性があるため、古い方法とされています。最近の方法は、event.preventDefault() を利用してデフォルトの動作を阻止し、必要な場合は false を返します。例:

document.getElementById("myButton").addEventListener("click", function(event) {
// 执行其他的 JavaScript 代码
return false; // 阻止按钮的默认行为
});

上のコードでは、return false はボタンのデフォルトの動作とイベントの伝搬を阻止するだけでなく、ブラウザのアドレスバーに「javascript:void(0)」を表示しません。

bannerAds