HTML のボタン タグをクリックしてページにジャンプする 3 つの方法

HTML のボタン タグをクリックしてページにジャンプする 3 つの方法

方法1: onclickイベントを使用する

<input type="button" value="button"
onclick="javascript:window.location.href='http://www.baidu.com/'" />

またはボタンタグを直接使用する

<button onclick="window.location.href = 'https://www.baidu.com/'">百度</button>

方法2: ボタンタグにaタグを追加する

<a href="http://www.baidu.com/">
    <button>百度</button>
</a>

または

<a href="http://www.baidu.com/"><input type="button" value='百度'></a>

方法3: JavaScript関数を使用する

<スクリプト>
関数ジャンプ(){
 ウィンドウの場所:
}
</スクリプト>
<input type="button" value="Baidu" onclick=javascript:jump() />
// または <input type="button" value="Baidu" onclick="jump()" />
// または <button onclick="jump()">Baidu</button>

要約する

上記は、HTML のボタン タグをクリックしてページ ジャンプを実現するためにエディターが紹介した 3 つの方法です。皆様のお役に立てれば幸いです。ご質問がある場合は、メッセージを残してください。エディターがすぐに返信いたします。また、123WORDPRESS.COM ウェブサイトをサポートしてくださっている皆様にも感謝申し上げます。
この記事が役に立ったと思われた方は、ぜひ転載していただき、出典を明記してください。ありがとうございます!

<<:  「いいね!」機能では MySQL と Redis のどちらを使用すればよいでしょうか?

>>:  TSで最も一般的な宣言マージ(インターフェースマージ)

推薦する

uni-app WeChatアプレット認証ログイン実装手順

目次1. appIDの申請と設定1. appidの取得方法2. AppIDの設定2. 基本的なユーザ...

HTML の相対パスと絶対パスの違いの分析

HTML 初心者は、ファイルを正しく参照する方法という問題によく遭遇します。たとえば、HTML ペー...

Linux でプロセスを隠す方法と、遭遇する落とし穴

序文1. この記事で使用したツールは、https://github.com/gianlucabore...

Centos7 環境でソースコードから mysql5.7.16 をインストールする方法の詳細な説明

この記事では、centos7 環境でソース コードから mysql5.7.16 をインストールする方...

ランキングを取得するためのMySQLソートの例コード

コードは次のようになります。 SELECT @i:=@i+1 行番号、 if(@total=t.s_...

MySQL 5.7 の同時レプリケーションにおける暗黙のバグの分析

序文当社の MySQL オンライン環境のほとんどはバージョン 5.7.18 を使用しています。このバ...

Docker rocketmq デプロイメントの実装例

目次準備展開プロセスRocketMQ の初体験関連する質問ヘルプドキュメント私は最近 RocketM...

Docker 環境で JMeter+Grafana+influxdb ビジュアル パフォーマンス監視プラットフォームを構築するチュートリアル

目次1. Dockerをインストールする2. influxDBをインストールして設定する3. Gra...

HTML/CSS の基礎 - HTML コード記述におけるいくつかの注意事項 (必読)

この記事の警告事項は、ブラウザの互換性とはまったく関係ありません。主に、プロジェクトで遭遇したいくつ...

Linux でプロセスを効果的に管理するための 8 つのコマンド

序文プロセス管理の役割:サーバーの健全性状態を判定する: プロセスの状態 (メモリ、CPU 占有率な...

Web でよく使われるフォントの紹介 (iOS および Android ブラウザでサポートされているフォント)

年末なので仕事も少なくなっています。私が何もせずにいるのを見ると、上司はきっと不快に思うでしょう。そ...

Vue は Ctrip のカルーセル効果を模倣します (スライディング カルーセル、以下は高度に適応)

まずケースを見てみましょう。vue+swiper を使用して実装します。スライドの高さが異なる場合、...

Vue は左右のスライド効果のサンプルコードを実装します

序文個人の実際の開発で使用した効果問題を、今後の開発やレビューに役立てるためにまとめています。他の人...

MySQLデータベースのデータテーブルに関する詳細な基本操作

目次1. 現在のデータベース内のテーブルを表示する2. テーブルを作成する3. 指定されたテーブル構...

MySQLでSQL文がどのように実行されるかの詳細な説明

概要最近MySQL関連の知識を勉強し始めました。学んだ知識ポイントと自分の理解を元に整理して共有しま...