JavaScript によるリンクのクリック時にページが上部にスクロールしないようにする方法
多くの開発者は、次の場合に Web ページが上部にスクロールするという問題に遭遇しています。リンクをクリックすると JavaScript が有効になります。目的のアクションが非ナビゲーション操作の実行である場合、これはイライラする可能性があります。
これを解決するには、クリック イベントのデフォルト アクション (リンク ターゲットへの移動) が発生しないようにする必要があります。これを実現するには、2 つの一般的な方法があります。
オプション 1:event.preventDefault()
このアプローチでは、イベントの .preventDefault() メソッドを呼び出します。オブジェクトがイベント ハンドラーに渡されます。これにより、ブラウザのネイティブ ナビゲーション動作が停止します。 jQuery を使用した例を次に示します。
<code class="javascript">$('#ma_link').click(function($e) { $e.preventDefault(); // Perform your JavaScript action here });</code>
オプション 2: return false
または、jQuery イベント ハンドラーから false を返すと、event.stopPropagation() と の両方が自動的にトリガーされます。イベント.preventDefault()。これにより、伝播とデフォルトのナビゲーションの両方が防止されます。
<code class="javascript">$('#ma_link').click(function(e) { // Perform your JavaScript action here return false; });</code>
非 jQuery DOM イベントの場合、このアプローチは HTML 5 仕様の一部であるため、最新のブラウザーでも使用できます。ただし、古いブラウザの場合は、互換性を最大限に高めるために .preventDefault() を明示的に呼び出すことをお勧めします。
以上がJavaScript によってトリガーされたリンクのクリック後にページが先頭にスクロールしないようにするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。