広告
<form>タグは、フォームを表す際に使用します。
form要素はフォーム関連の各種要素と組み合わせることで、
サーバーにデータ送信するためフォームや、他のページへ移動するハイパーリンクなどを作成します。
form要素のname属性は、フォームの名前を指定します。
name属性で指定する値は、文書内やフォーム群内の他のフォームと区別がつくように一意である必要があります。
name属性の値に空文字は指定できません。
action属性、enctype属性、method属性、novalidate属性、target属性は、
フォーム送信を制御する際に使用する属性です。
- accept-charset属性
-
フォーム送信に使用する文字エンコーディングを指定します。
accept-charset属性を指定する場合、値は大文字と小文字を区別せずに「UTF-8」と一致する必要があります。
- action属性
- フォーム送信に使用するURLを指定します。
- autocomplete属性
-
フォーム内のコントロールの自動入力機能のデフォルト設定を指定します。
指定できるキーワード値は on と off のいずれかで、指定を省略すると初期値はon状態となります。
- on …… on状態は、フォーム内のコントロールの自動入力機能がデフォルトで有効となります。
- off …… off状態は、フォーム内のコントロールの自動入力機能がデフォルトで無効となります。
- enctype属性
- フォーム送信に使用するエントリリストのエンコードタイプを指定します。
- method属性
- フォーム送信に使用するバリアントを指定します。
- name属性
- フォームの名前を指定します。
- novalidate属性
- フォーム送信時のフォームコントロールの検証をバイパスします。
- target属性
- フォーム送信のターゲット先を指定します。
- rel属性
- form要素が作成するリンクの種類をキーワードで指定します。
form要素のrel属性に指定できる値は、以下の通りです。
- external …… 参照ドキュメントが現在のドキュメントと同じサイトの一部ではないことを示します。
- help …… そのコンテキストに応じたヘルプへのリンクを提供します。
- license …… 現在のドキュメントの主な内容が、参照ドキュメントに記載されている著作権ライセンスの対象であることを示します。
- next …… 現在のドキュメントがシリーズの一部であり、シリーズの次のドキュメントが参照ドキュメントであることを示します。
- nofollow …… 現在のドキュメントの元の作成者または発行者が参照ドキュメントを承認していないことを示します。
- noopener …… ハイパーリンクが補助的な（つまり、適切なターゲット属性値を持つ）コンテキストを作成する場合、非補助の閲覧コンテキストを持つトップレベルのトラバース可能オブジェクトを作成します。
- noreferrer …… ヘッダーに「Referer」を含みません。さらに、noopenerと同じ効果があります。
- opener …… ハイパーリンクが非補助ブラウジングコンテキスト（つまり、ターゲット属性値として “_blank” を持つ）を使用してトップレベル横断の可能なオブジェクトを作成する場合、補助ブラウジングコンテキストを作成します。
- prev …… 現在のドキュメントがシリーズの一部であり、シリーズの前のドキュメントが参照ドキュメントであることを示します。
- search …… 現在のドキュメントとその関連ページを検索するために使用できるリソースへのリンクを提供します。
以下のサンプルは、form要素やinput要素を使って検索フォームを作成しています。
<form action="https://www.google.com/search" method="get">
<label>Google: <input type="search" name="q"></label> <input type="submit" value="Googleでウェブ検索">
</form>
<form action="https://www.bing.com/search" method="get">
<label>Bing: <input type="search" name="q"></label> <input type="submit" value="Bingでウェブ検索">
</form>
↓↓↓
広告
