form要素

使用例

<form action="/" method="get" target="_blank">
    <input type="text" name="foo" value="ABC" />
    <input type="submit" />
</form>

実行例

送信をクリックすると、actionの送信先に対してmethodの方式でリクエストし、レスポンスをtargetに表示します。またリクエストには、input要素の「name=value」のパラメータが付加されます。

属性

action (必須)

送信するデータを処理するプログラムの、URIを指定します。

これをaction=""と空の文字列にすると、form要素が置かれたページ自身へ送信されます。しかしブラウザによってフラグメントが残される場合とそうでない場合があるため、それが問題となるなら何らかの文字列を指定すべきです。

URIにフラグメントを付加していずれかの送信ボタンを押し、アドレスバーのURIを確認してください。

属性値 実行例
action=""
action="./"

mailtoスキーム

action属性のURIにmailtoスキームを指定することで、フォームからメールクライアントへデータを渡すことができます。ただしmailtoの動作はクライアントの環境に依存するため、可能ならばPHPなどへデータを渡し、そこからメール送信すべきです。

<form action="mailto:someone@example.com" method="get">
    <input type="text" name="subject" />
    <textarea name="body"></textarea>
    <input type="submit" value="メールを送信" />
</form>
件名:
本文:

method

HTTPのメソッド (method) を指定します。

  • get … GETメソッド (既定)
  • post … POSTメソッド

いずれの方式でも英数字以外のテキストはURLエンコードされるため、データサイズに注意が必要です。たとえばUTF-8の「あ」は「%E3%81%82」となり、1文字に9バイト費やします。

enctype

method="post"のときのMIMEタイプを指定します。

<form action="" method="post" enctype="multipart/form-data">
    <input type="file" name="data" />
    <input type="submit" />
</form>

target

データ送信後に表示するページを指定します。

  • _blank
  • _self
  • _parent
  • _top
  • フレーム名 (frame要素のname属性の値) またはウィンドウ名
<form action="sample.php" method="get" target="frameName">
    <input type="text" name="data" value="" />
    <input type="submit" />
</form>

<iframe name="frameName"></iframe>

このformでsubmitした場合、sample.phpのページへinput要素のvalue属性の値がGETで渡されます。PHPで処理するとき、そのページでは渡された値へ$_GET['data']でアクセスでき、そこでの出力はiframe要素に表示されます。

actionに無効なアドレスが指定されていると、ブラウザによってはtargetの指定が無視され'_self'で開かれます。これはInternet ExplorerやEdgeで確認できます。

<form action="http://" method="get" target="frameName">

accept-charset

サーバが処理可能な符号化方式 (エンコーディング) を指定します。この属性を省略したときは、そのページの符号化方式と同じそれで送信されます

<form action="" accept-charset="UTF-8">

Internet Explorerは、この属性を無視します。

この属性に指定できる値の一覧が、Character Set Recognition (Internet Explorer)にあります。

  ラベル 別名
UTF-8 utf-8 unicode-1-1-utf-8、unicode-2-0-utf-8、x-unicode-2-0-utf-8
US-ASCII us-ascii ANSI_X3.4-1968、ANSI_X3.4-1986、ascii、cp367、csASCII、IBM367、ISO_646.irv:1991、ISO646-US、iso-ir-6us
Shift_JIS shift_jis csShiftJIS、csWindows31J、ms_Kanji、shift-jis、x-ms-cp932、x-sjis

※ このページはUTF-8で、送信先のページも同様です。

受信データ