戻る

FORM要素

フォームを作成するのに用いる

開始タグ:省略不可 修了タグ:省略不可

属性

action: フォームを受け取り処理するプログラムのURLを指定する。例えば、フォームをCGIで処理する場合はそのCGIのURLを記述する。
method: フォームを提出する際に「get」か「post」、どちらのHTTPメソッドを用いるかを指定する。フォームを受け取って処理するプログラムが、何かのファイルやデータベースを変更するなどの処理を行なう場合は「post」を、そうでない場合は「get」を用いる。わからなければ常に「post」を指定しておいても問題はないだろう。
enctype: method属性がpostの場合、サーバに提出するMIMEタイプを指定する。デフォルトでは「application/x-www-form-urlencoded」となっている。フォームでファイルを送る場合は「multipart/form-data」を指定する。それ以外の場合で、わからなければデフォルトの設定から変更する必要はない。
accept-charset: フォームに入力されるデータの文字コードを指定する。指定しなかった場合は、フォームを記述したときに用いられた文字コードと同じになる。
accept: サーバが処理可能なMIMEタイプを指定する。複数あればコンマで区切って列挙する。ファイルを送信する際に、受け取れるファイルのMIMEタイプを指定する。
id
class
lang
dir
style
title
target

説明

フォームは、テキスト入力欄、パスワード入力欄、チェックボックス、ラジオボックス等を用いて、 WEBページの閲覧者に入力をしてもらい、それをaction属性で指定したプログラムに送る。通常のWEBページは情報を閲覧するだけだが、フォームを用いて入力欄を用意すると、ユーザーから情報を送り返してもらうことができる。 method属性で指定する、フォームを受け取り処理するプログラムは自分で用意しなければならない。例えばCGI等がある。

例

<html>
<head>
<title>フォームの使用例</title>
</head>
<body>
<h1>フォームの使用例</h1>
<H1>あなたの自慢の猫耳メイド写真投稿フォーム</H1>
<P>あなたのお家にいる自慢の猫耳メイドの写真を投稿してください。</P>
<P><EM>画像の投稿は猫耳メイド協会の実施する試験に合格した人しか行なえません。</EM></P>
<FORM action="http://moox.minidns.net/cgi-bin/sample.cgi"
enctype="multipart/form-data"
accept-chaeset="euc-jp"
accept="image/jpeg, image/png"
method="post">
<P>
合格時にあなたが協会から与えられた名前を入力してください : 
<INPUT type="text" name="username" size="8" maxlength="32"><BR>
パスワード : <INPUT type="password" name="password" size="8" maxlength="32"><BR>
「(猫耳)メイド」以外のあなたの属性は?<BR>
<INPUT type="checkbox" name="zokusei" checked>猫耳全般<BR>
<INPUT type="checkbox" name="zokusei">めがね<BR>
<INPUT type="checkbox" name="zokusei">ほっぺぷにぷに<BR>
<INPUT type="checkbox" name="zokusei">制服<BR>
<INPUT type="checkbox" name="zokusei">幼なじみ<BR>
</P>
<P>
画像についての質問です。<BR>
<!-- ここからラジオボタン -->
この画像は<BR>
<INPUT type="radio" name="attribute1" checked>全年令対象<BR>
<INPUT type="radio" name="attribute1">18際未満閲覧禁止<BR>
<INPUT type="radio" name="attribute1">21際未満閲覧禁止<BR>
<!-- ここまで -->
<BR>
画像の選択 : 
<INPUT type="file" name="picture"><BR>
</P>
<P>
<INPUT type="text" name="tikai" value="私は教祖様に忠誠を誓います。" size="28" readonly><BR>
<INPUT type="text" name="waring" value="実際に画像は送れません。" size="28" disabled><BR>
<INPUT type="submit" value="画像送信">
<INPUT type="reset" value="リセット">
<INPUT type="button" value="ほぇ?">
<INPUT type="hidden" name="from" value="gazoutoukou">
</P>
</FORM>
</body>
</html>

例をHTMLにしてみました。

戻る