HTMLフォーム属性
この章では、HTML<form>要素のさまざまな属性について説明します。
アクション属性
このaction属性は、フォームが送信されたときに実行されるアクションを定義します。
通常、ユーザーが送信ボタンをクリックすると、フォームデータがサーバー上のファイルに送信されます。
以下の例では、フォームデータは「action_page.php」というファイルに送信されます。このファイルには、フォームデータを処理するサーバー側スクリプトが含まれています。
例
送信時に、フォームデータを「action_page.php」に送信します。
<form action="/action_page.php">
<label for="fname">First
name:</label><br>
<input type="text" id="fname" name="fname"
value="John"><br>
<label for="lname">Last name:</label><br>
<input type="text" id="lname" name="lname" value="Doe"><br><br>
<input type="submit" value="Submit">
</form>
ヒント：action属性を省略すると、アクションは現在のページに設定されます。
ターゲット属性
このtarget属性は、フォームの送信後に受信した応答を表示する場所を指定します。
属性には、次のいずれかのtarget値を指定できます。
| Value | Description |
|---|---|
| _blank | The response is displayed in a new window or tab |
| _self | The response is displayed in the current window |
| _parent | The response is displayed in the parent frame |
| _top | The response is displayed in the full body of the window |
| framename | The response is displayed in a named iframe |
デフォルト値は_self、応答が現在のウィンドウで開くことを意味します。
例
ここで、送信された結果は新しいブラウザタブで開きます。
<form action="/action_page.php" target="_blank">
メソッド属性
このmethod属性は、フォームデータを送信するときに使用されるHTTPメソッドを指定します。
form-dataは、URL変数（with method="get"）またはHTTP postトランザクション（with method="post"）として送信できます。
フォームデータを送信するときのデフォルトのHTTPメソッドはGETです。
例
この例では、フォームデータを送信するときにGETメソッドを使用します。
<form action="/action_page.php" method="get">
例
この例では、フォームデータを送信するときにPOSTメソッドを使用します。
<form action="/action_page.php" method="post">
GETに関する注意：
- 名前と値のペアで、フォームデータをURLに追加します
- GETを使用して機密データを送信しないでください。（送信されたフォームデータはURLに表示されます！）
- URLの長さには制限があります（2048文字）
- ユーザーが結果をブックマークしたいフォーム送信に便利です
- GETは、Googleのクエリ文字列などの安全でないデータに適しています
POSTに関する注意：
- HTTPリクエストの本文内にフォームデータを追加します（送信されたフォームデータはURLに表示されません）
- POSTにはサイズ制限がなく、大量のデータを送信するために使用できます。
- POSTを使用したフォーム送信はブックマークできません
ヒント：フォームデータに機密情報や個人情報が含まれている場合は、常にPOSTを使用してください。
オートコンプリート属性
このautocomplete属性は、フォームのオートコンプリートをオンにするかオフにするかを指定します。
オートコンプリートがオンの場合、ブラウザはユーザーが以前に入力した値に基づいて値を自動的に完了します。
例
オートコンプリートがオンになっているフォーム：
<form action="/action_page.php" autocomplete="on">
Novalidate属性
novalidate属性はブール属性です。
存在する場合、送信時にフォームデータ（入力）を検証しないように指定します。
例
novalidate属性を持つフォーム：
<form action="/action_page.php" novalidate>
HTML演習
すべての<form>属性のリスト
| 属性 | 説明 |
|---|---|
| accept-charset | フォームの送信に使用される文字エンコードを指定します |
| アクション | フォームが送信されたときにフォームデータを送信する場所を指定します |
| オートコンプリート | フォームのオートコンプリートをオンにするかオフにするかを指定します |
| enctype | サーバーに送信するときにフォームデータをエンコードする方法を指定します（method = "post"の場合のみ） |
| 方法 | フォームデータを送信するときに使用するHTTPメソッドを指定します |
| 名前 | フォームの名前を指定します |
| novalidate | 送信時にフォームを検証しないことを指定します |
| rel | リンクされたリソースと現在のドキュメント間の関係を指定します |
| 目標 | フォームの送信後に受信した応答を表示する場所を指定します |