フォーム送信コード 1. ソースコード分析 <!DOCTYPE html> <html lang="ja"> <ヘッド> <メタ文字セット="UTF-8"> <meta name="viewport" content="width=デバイス幅、初期スケール=1.0"> <meta http-equiv="X-UA-compatible" content="ie=edge"> <title>ドキュメント</title> </head> <本文> <フォームアクション="/form.html" メソッド="GET"> <!-- action: フォームが送信されるアドレス--> <!-- method: 保険証券を提出する方法 --> <div クラス="名前"> <label for="name">ユーザー名</label> <input type="text" name="name" id="name" placeholder="ユーザー名を入力してください"> <!-- プレースホルダーは透明なプロンプトテキストです --> </div> <div class="パスワード"> <label for="password">パスワード</label> <input type="password" name="password" id="password" placeholder="パスワードを入力してください"> </div> <div class="sex"> <label for="sex">性別</label> <input type="radio" name="sex" value="male">男性<input type="radio" name="sex" value="female">女性</div> <div class="city"> <label for="city">お気に入りの都市</label> <名前を選択="都市" id="都市"> <option value="beijing">北京</option> <option value="shanghai">上海</option> <option value="chongqing" を選択 >重慶</option> <!-- selected は、選択されてページに表示されているオプションを示します --> </選択> </div> <div class="趣味"> <label for="hobby">趣味</label> <input type="checkbox" name="hobby" value="read">読書<input type="checkbox" name="hobby" value="flower">フラワーアレンジメント<input type="checkbox" name="hobby" value="sing">歌<!-- オプション名はすべて同じである必要があります--> </div> <div class="エリア"> <textarea id="area" name="area" cols="30" rows="10"></textarea> </div> <button>ボタン</button> <!-- フォームを送信できます --> <input type="submit" value="submit"> <!-- フォームを送信できます --> <input type="button" value="button"> <!-- フォームを送信できません --> <input type="reset" value="reset"> <!-- フォームにすでに入力されている内容をリセットします --> </フォーム> </本文> </html> 2. 端末操作 ターミナルgitbashを開き、htmlが配置されているフォルダに切り替えます。 コマンドライン http-server を使用して静的サーバーを開くと、開いた後に 2 つの IP アドレスが表示されます。 127.xxx はローカル アクセス アドレス、125.xxx は LAN アクセス アドレスです (ここでの前提は、nodejs がインストールされ、http-server サーバーが npm でインストールされていることです) ブラウザで HTML ファイルを開きます。ローカル ファイル アドレスを http://127.0.0.1:8080 に置き換えます。 フォームから送信された情報を確認するには、Check-network-headerをクリックしてください。 3. getメソッドとpostメソッドの違い
4. 注意事項 すべての入力タグに name 属性を追加する必要があります。そうしないと、データを正しく受信できません。 以上がこの記事の全内容です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。 |
<<: JavaScript の BigIn 関数の共通プロパティをまとめます
>>: Alibaba Cloud ServerにMySQLデータベースをインストールする方法の詳細な説明
1. Windows システムでは、JDK のインストールなど、多くのソフトウェアのインストールで...
Ubuntu 20.04 をインストールした後、デフォルトでは root アカウントのログイン権限が...
この記事では、3階層ナビゲーションの表示と非表示を実現するためのVueの具体的なコードを例として紹介...
目次序文コンポーネントの紹介クラスコンポーネントの作成状態についてレンダリングについて関数コンポーネ...
mysql使用中に接続数が超過していることが判明しました~~~~ [root@linux-node...
方法1: .bashrcまたは.bash_profileファイルを変更するこれは、ホーム ディレクト...
1 はじめに「Maven がワンクリックで Springboot を Docker リポジトリにデプ...
サーバーでは、データベースにすばやくログインするために、通常は mysql -hhost -uuse...
質問画像とテキストのシームレスなスクロールは、一般的に携帯電話では良い効果をもたらしますが、一部のモ...
mkdir コマンドを使用して新しいディレクトリを作成できることは誰もが知っていますが、多くの場合、...
この記事では主に、すべてのコンテナを削除する Docker stop/remove を紹介し、皆さん...
数日前、友人と Node.js の epoll とリクエスト処理に関する知識を交換しました。今日は、...
効果画像: 1. はじめに独自のアプレットでこのような機能を実装する必要がある1. 核となる考え方ス...
序文「データベース トランザクションの特徴は何ですか?」と尋ねられたら、 ACID 特性である原子性...
目次1. プロジェクトフォルダ構造1. アセットフォルダ2. 図書館3. ローカル設定(ローカル) ...