form要素(フォーム)とは？使用できる属性は？【HTML】

お問い合わせなど、ユーザーが情報を入力して、その情報をサーバーに送信するためのフォームを表すのがform要素です。

form要素で指定できる属性はどのようなものがあるかまとめました。

form要素で使える属性

form要素では以下のような属性が使えます。

• accept-charset（アクセプト・キャラクター・セット）
• action（アクション）
• autocomplete（オート・コンプリート）
• enctype（エンコード・タイプ）
• method（メソッド）
• name（ネーム）
• novalidate（ノー・ヴァリデート）
• target（ターゲット）

accept-charset（アクセプト・キャラクター・セット）

accept-charset属性は、フォームで送信が可能な文字コードを指定する属性です。

半角スペースで区切ることによって、複数の値を指定することもできます。

action（アクション）

フォームで入力されたデータが送られる、送信先をURLで指定するのがaction属性です。

一般的には、サーバー側で受け取るプログラムを指定します。

autocomplete（オート・コンプリート）

オートコンプリートといって、過去に入力した情報を記憶し、次に入力するときに最初の文字を入力するだけで自動的に候補を出してくれる機能があります。

そのオートコンプリートを行うかどうかはautocomplete属性で決めることができ、onかoffの値を指定します。

on

onを指定するとオートコンプリートを行います。

また、onが初期値として設定されています。

off

autocomplete属性でoffが指定されると、オートコンプリートは行ないません。

enctype（エンコード・タイプ）

enctype属性で、フォームが送信するデータ形式を指定することができます。

指定できる値は以下のようなもの。

application/x-www-form-urlencoded

初期値は「application/x-www-form-urlencoded」です。

この値はデータがURLエンコードされて送信されることを示しています。

ちなみにURLエンコードとは、日本語URLが半角英数字・記号に変換されること。

multipart/form-data

「multipart/form-data」を指定すると、データはマルチパートデータとして送信されます。

input要素のtype属性でfileを指定し、ファイルを送信する際には必ず指定する必要があります。

text/plain

「text/plain」を指定すると、データはプレーンテキストとして送信されます。

method（メソッド）

method属性でデータを送信する方式を指定することができます。

指定できる値はgetかpost。

get

getは初期値として指定されている値で、action属性で指定されたURLにクエリ文字列として付加された状態で送信されます。

post

postを指定すると、action属性で指定されたURLに送信されるデータは本文として扱われ、大きなデータを送信するときなどに向いています。

一般的に、サーバー側のプログラムで受け取るデータはこのpostを使います。

name（ネーム）

name属性でフォームに名前を付与することができます。

novalidate（ノー・ヴァリデート）

入力されたデータを検証するかどうかをnovalidate属性で指定します。

この属性が指定された場合は、フォーム送信を行う際にデータ検証を行いません。

また、novalidate属性は値を必要としない論理属性です。

target（ターゲット）

データ送信後の応答画面を表示する対象を以下の値で指定する

属性値	意味
_blank	リンク先を新しいウィンドウ（タブ）で表示
_parent	1つ上位のブラウジングコンテキストで表示
_self	現在のブラウジングコンテキストで表示
_top	最上位のブラウジングコンテキストで表示

関連記事
ブラウジングコンテキストとはWebページを表示する環境のこと

フォームを表すform要素ですが、入力する欄などはinput要素やtextarea要素などによって構成されます。