htmlハイパーリンクaのクリックイベントの後、hrefで指定されたアドレスにジャンプします。

htmlハイパーリンクaのクリックイベントの後、hrefで指定されたアドレスにジャンプします。
場合によっては、ジャンプを完了するために href の代わりにハイパーリンク <a> を使用する必要がありますが、代わりに次のメソッドを使用します: <a href="#" onClick="fun()"></a>。こうすることで、ページがジャンプしなくなります。しかし、ページタイトルが「#」になったり、ページにスクロールバーが表示されたりするなど、いくつかのマイナスの問題も発生します。これは、onClick イベントが実行された後、<a> が href で指定されたアドレスにジャンプし、「#」がアンカー ポイントであり、デフォルトで Web ページの先頭に設定されるために、上記の問題が発生するためです。

解決策は2つあります。

1. onClick イベントに return false ステートメントを追加します。例:

<a href="#" onClick="fun(); return false;">クリック</a>

2. # の代わりに void(0) を使用します。例:

<a href="javascript:void(0)" onclick="fun()">クリック</a>

<<:  CSS3 のフィルタプロパティの使用に関する詳細な説明

>>:  MySQLシリーズ15 MySQL共通設定とパフォーマンスストレステスト

推薦する

カルーセル例の JavaScript 実装

この記事では、カルーセルの効果を実現するためのJavaScriptの具体的なコードを参考までに共有し...

CSS のみを使用して折りたたまれたヘッダー効果を作成する方法の例コード

折りたたまれたヘッダーは、特別オファーや重要なお知らせなど、ユーザーにとって重要な情報を表示するのに...

MySQL マルチバージョン同時実行制御 MVCC の実装

トランザクション分離レベルの設定 グローバルトランザクション分離レベルを読み取りコミット済みに設定;...

ElementuiはデータをxlsxとExcelテーブルにエクスポートします

最近、Vue プロジェクトについて知り、ElementUI でデータを xlsx および Excel...

Docker ベースの Redis 1 マスター、2 スレーブ、3 センチネルの実装

現在、Redis とコンテナについて学習中なので、Docker を使用して Redis マスタースレ...

XHTMLタグは適切に使用する必要があります

<br />123WORDPRESS.COM の以前のチュートリアルでは、Web ページ...

背景画像にテキストを表示するためのCSS

効果: <div class="imgs"> <!-- 背景画...

最適なウェブページ幅とその互換性のある実装方法

1. Web ページをデザインするときに、幅を決定するのは非常に面倒な作業です。 jb51.net ...

Windows Apache 環境で SSL 証明書を展開して、Web サイトを https 対応にする方法

SSL 証明書の使用についてはここでは説明しません。SSL 証明書を導入する必要がある友人は、すでに...

シンプルなタブバー切り替えコンテンツバーを実装するJavaScript

この記事では、タブバーの切り替えコンテンツバーを簡単に実現するためのJavaScriptの具体的なコ...

Linux環境でタイムゾーンを設定できない問題を解決

Linuxでタイムゾーンを変更する場合、常に変更することはできませんAsia/Shanghai に変...

Linuxでawkを使用する方法の詳細な説明

awk を学ぶ前に、sed、grep、tr、cut などのコマンドを学んでおく必要があります。これら...

Vue の echarts ツールチップにクリック イベントを追加する詳細な説明

目次必要回避策1. ツールチップを設定する2. hookToolTip変数を定義する3. メソッド内...

HTTPS の原則の説明

HTTPS ウェブサイトの構築コストが下がるにつれて、ほとんどのウェブサイトが HTTPS プロトコ...

vue+iviewのメニューとタブの連携方法

Vue+iview メニューとタブのリンク現在、vue+iview を使用してバックエンド管理システ...