「JavaScript」preventDefaultメソッドでイベントをキャンセルする
環境
Google Chrome 102.0.5005.63
Windows 10 Home 64bit
構文
preventDefault
要素に設定されている、デフォルトのイベント(動作)をキャンセルします。
使用例
<!DOCTYPE html> <html> <body> <a id="gglink" href="https://www.google.co.jp/" >googleサイト</a> <script> document.getElementById("gglink").addEventListener('click', function(e){ console.log('google文字リンクがクリックされました。'); // デフォルトのイベントをキャンセル e.preventDefault(); }, false); </script> </body> </html>
実行結果
e.preventDefault でデフォルトのイベントをキャンセルしているためgoogleサイトに遷移しない。
コンソールにメッセージ 「’google文字リンクがクリックされました。」が出力されます。