JavaScript を使用してハイパーリンクのリダイレクトを防ぐ方法 (複数の書き方)
|
JavaScript を使用すると、ハイパーリンクがジャンプするのを防ぐことができます。 方法は次のとおりです。 （１）ハイパーリンクのhref属性の操作 書き方1：
<!DOCTYPE html>
<html lang="ja">
<ヘッド>
<メタ文字セット="UTF-8">
<meta http-equiv="X-UA-compatible" content="IE=edge">
<meta name="viewport" content="width=デバイス幅、初期スケール=1.0">
<title>ドキュメント</title>
</head>
<本文>
<a href="javascript:void(0);" rel="external nofollow" >ハイパーリンク</a>
</本文>
</html>書き方2：
<!DOCTYPE html>
<html lang="ja">
<ヘッド>
<メタ文字セット="UTF-8">
<meta http-equiv="X-UA-compatible" content="IE=edge">
<meta name="viewport" content="width=デバイス幅、初期スケール=1.0">
<title>ドキュメント</title>
</head>
<本文>
<a href="javascript:;" rel="external nofollow" >ハイパーリンク</a>
</本文>
</html>
リンクをクリックしてもリダイレクトされません。 （２）リンクをブロックするデフォルトの動作 書き方1：
<!DOCTYPE html>
<html lang="ja">
<ヘッド>
<メタ文字セット="UTF-8">
<meta http-equiv="X-UA-compatible" content="IE=edge">
<meta name="viewport" content="width=デバイス幅、初期スケール=1.0">
<title>ドキュメント</title>
</head>
<本文>
<a href="https://www.baidu.com" rel="external nofollow" rel="external nofollow" >バイドゥ</a>
<スクリプト>
var link = document.querySelector("a");
link.addEventListener('click',function(e){
e.preventDefault();
})
</スクリプト>
</本文>
</html>書き方2：
<!DOCTYPE html>
<html lang="ja">
<ヘッド>
<メタ文字セット="UTF-8">
<meta http-equiv="X-UA-compatible" content="IE=edge">
<meta name="viewport" content="width=デバイス幅、初期スケール=1.0">
<title>ドキュメント</title>
</head>
<本文>
<a href="https://www.baidu.com" rel="external nofollow" rel="external nofollow" >バイドゥ</a>
<スクリプト>
var link = document.querySelector("a");
link.onclick = 関数 (e) {
false を返します。
}
</スクリプト>
</本文>
</html>
現時点では、ハイパーリンクをクリックしてもジャンプしません。 以上がJavaScriptを使ってハイパーリンクジャンプを防ぐ方法（書き方いろいろ）の詳細です。jsハイパーリンクジャンプについての詳細は、123WORDPRESS.COM内の他の関連記事もぜひご注目ください！ 以下もご興味があるかもしれません:
|
<<: Ubuntu 19 以下に Android Studio をインストールするチュートリアル
>>: MySQL で最大接続数を設定するためのヒントのまとめ
推薦する
Vue diffアルゴリズムの完全な分析
目次序文Vue 更新ビューパッチ同じVノードパッチVノード更新子供序文Vue は仮想 DOM を使用...
JavaScript の基本オブジェクト
目次1. オブジェクト1.1 オブジェクトとは何ですか? 1.2 なぜオブジェクトが必要なのか? 2...
Linux で Sudo を使用して権限を委譲する
sudo 権限委譲の概要su スイッチ ID: su –l ユーザー名 –c 'コマンド&#...
Navicat を仮想マシン MySQL に接続する際によくあるエラーと解決策
質問1 解決するサービスを開始します: service mysqld start; /sbin/ip...
ページリファクタリングスキル - コンテンツ
雑談はここまでにして、インターネット上で見つかる高性能な Yahoo ウェブサイトを構築するための数...
SQL 集計、グループ化、並べ替え
目次1. 集計クエリ1. COUNT関数2. SUM関数3. AVG関数4. MAX関数とMIN関数...
Docker コンテナでネットワーク リクエストが遅くなる問題の解決策
Docker の使用中に、いくつかの問題が発見されました。npm install や bundle ...
CSS3 の新しいレイアウト: flex の詳細な説明
Flexの基本概念フレックス レイアウト (フレックスはフレキシブル ボックスの略)、エラスティック...
Linux 環境変数の設定方法のまとめ (.bash_profile と .bashrc の違い)
Linux では、アプリケーションをダウンロードしてインストールすると、起動時にアプリケーション名...
CSS3 の display:grid、グリッドレイアウトの紹介
1. グリッドレイアウト（グリッド）: Web ページをグリッドに分割し、さまざまなグリッドを組み合...
HTML でテーブルを分割および結合する (colspan、rowspan)
このコードは水平マージを示しています。 <!DOCTYPE html PUBLIC "...
CMD で MySQL データベースを操作するときに中国語の文字化けが発生する問題の解決方法
Baiduで検索しました。 。 chcp コマンドを使用して、cmd の文字エンコーディングを 65...
HTMLタグIDは変数にできる
<table id=" <%=var1%>">、var1...
Javascriptはセキュリティ検証に整合性属性を使用します
目次1. スクリプトタグを使用してファイルをインポートする1. ローカルファイルをインポートする2....
Vue のミックスインの使用方法の詳細な説明
目次序文1. Mixin とは何ですか? 2. Mixin はいつ使用すればよいですか? 3. Mi...