■ 説明入力フォームを表示します。<FORM>〜</FORM>がひとつのフォームとなります。フォームの中には<INPUT>や<SELECT>タグなどを用いてフォーム部品を配置することができます。
■ 属性
属性 説明 ACTION="..." H2/e2/N2。実行(submit)ボタンを押した時に実行するアクションを指定します。ACTION="mailto:〜"とするとフォームの内容を〜のアドレスにメール送信します。(IE3.0の場合は単にメールウィンドウを起動するだけのようです)ACTION="〜.cgi"とすると、〜.cgi をCGIスクリプトとして実行します。ACTION="JavaScript:〜"として、簡単なJavaScriptを実行することもできるようです。 METHOD=... H2/e2/N2。フォームに入力した値をCGIスクリプトに渡す方式を指定します。METHOD=GETとすると環境変数QUERY_STRINGで渡します。METHOD=POSTとすると標準入力に渡します。 ENCTYPE="..." H2/N2。スクリプトにデータを受け渡す際のエンコード方法を指定します。通常は省略して構いませんが、ファイル転送機能の際などに用います。 TARGET=... H4/e3/N2。スクリプトの実行結果を表示するウィンドウ(フレーム)を指定します。<A>を参照してください。 NAME="..." H4/e3/N2。フォームに名前を付けます。この名前はJavaScriptなどで使用されます。 onSubmit="..." H4/e3/N2。JavaScriptを記述します。 onReset="..." H4/e4/N3。JavaScriptを記述します。 ■ 使用例
【HTMLソース】
<FORM METHOD=POST ACTION="cgi-bin/cgitest.cgi"> テキスト入力: <INPUT TYPE=text NAME="TEXT1" VALUE="ABC" SIZE=30> <P> パスワード入力: <INPUT TYPE=password NAME="PASSWD1" SIZE=30> <P> 複数行入力:<BR> <TEXTAREA NAME="TAREA1" COLS=20 ROWS=2> あいうえお </TEXTAREA> <P> <INPUT TYPE=checkbox NAME="CBOX1" CHECKED>チェックボタン1 <INPUT TYPE=checkbox NAME="CBOX2">チェックボタン2 <P> <INPUT TYPE=radio VALUE="R1" NAME="RAD1" CHECKED>ラジオボタン1 <INPUT TYPE=radio VALUE="R2" NAME="RAD1">ラジオボタン2 <P> <SELECT NAME="SELECT1"> <OPTION VALUE="No1" >選択肢その1 <OPTION VALUE="No2" >選択肢その2 <OPTION VALUE="No3" SELECTED>選択肢その3 </SELECT> <P> <SELECT NAME="SELECT2" SIZE=2> <OPTION VALUE="No1">選択肢その1 <OPTION VALUE="No2">選択肢その2 <OPTION VALUE="No3" SELECTED>選択肢その3 </SELECT> <P> <INPUT TYPE=submit VALUE="実行"> <INPUT TYPE=reset VALUE="取消"> </FORM>【ブラウザでの表示】
■ 説明<FORM>タグにおいて、 テキスト入力や実行(submit)ボタンなどのフォーム部品を表示します。
- TYPE=text(テキスト)
- TYPE=password(パスワード)
- TYPE=checkbox(チェックボックス)
- TYPE=radio(ラジオボタン)
- TYPE=hidden(隠しフィールド)
- TYPE=image(イメージ)
- TYPE=submit(サブミットボタン)
- TYPE=reset(リセットボタン)
- TYPE=button(ボタン)
- TYPE=file(ファイル転送)
■ 共通属性
属性 説明 NAME="..." H2/e2/N2。フォーム部品の名前を指定します。この名前はCGIスクリプトなどに渡されて入力データを識別するのに用いられます。 ACCESSKEY=... H4/e4。例えば ACCESSKEY=X としておくと、キーボードでALTキーを押しながらXキーを押したときにこの部品にフォーカスが移動したり、ボタンが押されたことになります。 TABINDEX=... H4/e4。TABキーを押したとき、ここで指定した数値の小さい順番にフォーカスが移動します。 ■ 使用例
<FORM>を参照してください。
■ 説明通常のテキストを入力するフォームです。250文字程度しか送信できないブラウザもありますので、長めの文書を入力させるには<TEXTAREA>を用いましょう。
■ 個別属性
属性 説明 SIZE=n H2/N2/e2。入力フィールドの横幅を指定します。 MAXLENGTH=n H2/N2/e2。最大入力文字数を指定します。 VALUE="..." H2/N2/e2。初期状態のフィールドの内容を指定します。 onChange="..." H4/N2/e3。JavaScriptを記述します。 onSelect="..." H4/N2/e3。JavaScriptを記述します。 onFocus="..." H4/N2/e3。JavaScriptを記述します。 onBlur="..." H4/N2/e3。JavaScriptを記述します。
■ 説明パスワードを入力するフォームです。 入力文字がアスタリスク(*)で表示されること以外は TYPE=text と同様です。
■ 説明複数選択のチェック項目に用います。
■ 個別属性
属性 説明 VALUE="..." H2/e2/N2。この項目がチェックされた時に送信される値を指定します。 CHECKED H2/e2/N2。この項目の初期状態をチェックされた状態にします。 onClick="..." H4/e3/N2。JavaScriptを記述します。
■ 説明択一選択のチェック項目に用います。
■ 個別属性
属性 説明 VALUE="..." H2/e2/N2。この項目がチェックされた時に送信される値を指定します。 CHECKED H2/e2/N2。この項目の初期状態をチェックされた状態にします。 onClick="..." H4/e3/N2。JavaScriptを記述します。
■ 説明画面には表示されない隠しフィールドです。 表示されないフィールドなんか使いようがないと思われるかもしれませんが、CGIスクリプトが自動生成したフォームページに、ユーザーの入力以外の固定値を持たせる時などに有効です。
■ 個別属性
属性 説明 VALUE="..." H2/e2/N2。フィールドの値を指定します。
■ 説明指定したイメージを表示し、イメージをクリックすると、そのクリックした位置をWWWサーバーに送ります。他に<INPUT TYPE=text>などのフォーム部品があれば、その値も同時に送信します。例えば、NAME="ABC" とした場合、ABC.x=123, ABC.y=456のような値が送信されます。
■ 個別属性
属性 説明 SRC="..." H2/e2/N2。イメージのURLを指定します。 ALIGN="..." H2/e2/N2。配置を指定します。<IMG>を参照してください。
■ 説明このボタンを押すと、<FORM>タグのACTION属性で指定した動作を行います。
■ 個別属性
属性 説明 VALUE="..." H2/e2/N2。ボタンに表示する名前を指定します。 onClick="..." H4/e3/N2。JavaScriptを記述します。 ■ 補足
通常のボタンではなく、自分で用意した画像をボタンの代わりに使用したいときは、<INPUT TYPE=image SRC="..." BORDER=0> を用います。
■ 説明このボタンを押すと、すべての入力項目が初期値に戻ります。
■ 個別属性
属性 説明 VALUE="..." H2/e2/N2。ボタンに表示する名前を指定します。 onClick="..." H4/e3/N2。JavaScriptを記述します。
■ 説明ブラウザ側からWWWサーバー側へファイルを転送(アップロード)する際に用います。詳細は「ファイルをアップロードするには」を参照してください。
■ 説明ボタンです。 NN2.0のJavaScript対応でサポートされました。JavaScript未対応のブラウザでは表示されませんので注意してください。
■ 個別属性
属性 説明 VALUE="..." H2/e2/N2。ボタンに表示する名前を指定します。 onClick="..." H4/e3/N2。JavaScriptを記述します。
■ 説明ボタンです。 <INPUT TYPE=button>の代わりに用います。 <BUTTON>〜</BUTTON>で囲まれた部分がボタン上に表示されます。 HTML4.0の草案で提案され、IE4.0で実装されましたが、NNがまだ対応していないので、当面は<INPUT TYPE=button>を使用することになるでしょう。
■ 属性
属性 説明 NAME="..." H4/e4。ボタンの名前を指定します。 TYPE="..." H4/e4。button、reset、submitのいずれかを指定します。 DISABLED H4/e4。ボタンを押したときの動作を無効にします。 ACCESSKEY=... H4/e4。例えば ACCESSKEY=X としておくと、キーボードでALTキーを押しながらXキーを押したときにこのボタンが押されたことになります。
■ 説明<FORM>タグにおいて、複数行入力フィールドを表示します。 <TEXTAREA>〜</TEXTAREA>までの間のテキストがフィールドに表示されますが、<PRE>と同様、IEとNNで、<TEXTAREA>直後の改行の扱いが異なるので注意。
■ 属性
属性 説明 NAME="..." H2/e2/N2。フィールドに名前をつけます。この名前はメールの中身やCGIスクリプトに渡したパラメータの中で、どのフィールドの入力値かを識別するのに用います。 ROWS=n H2/e2/N2。入力フィールドの縦方向の行数を指定します。 COLS=n H2/e2/N2。入力フィールドの横方向の大きさを指定します。 WRAP=... e3/N2。 自動改行を制御します。 off(自動改行しない)、 hard(横幅いっぱいになったら自動改行する)、 soft(自動改行するがサーバーに送信するデータは改行しない) のいずれかを指定することができます。 NNでの省略値はoffで、IEではsoft固定だそうです。 onChange="..." H4/e3/N2。JavaScriptを記述します。 onSelect="..." H4/e3/N2。JavaScriptを記述します。 onFocus="..." H4/e3/N2。JavaScriptを記述します。 onBlur="..." H4/e3/N2。JavaScriptを記述します。 ACCESSKEY=... H4/e4。例えば ACCESSKEY=X としておくと、キーボードでALTキーを押しながらXキーを押したときにこの部品にフォーカスが移動します。 TABINDEX=... H4/e4。TABキーを押したとき、ここで指定した数値の小さい順番にフォーカスが移動します。 ■ 使用例
<FORM>を参照してください。
■ 説明<FORM>タグにおいて、 選択フォーム部品を表示します。
■ 属性
属性 説明 NAME="..." H2/e2/N2。フィールドに名前をつけます。この名前はメールの中身やCGIスクリプトに渡したパラメータの中で、どのフィールドの入力値かを識別するのに用います。 SIZE=n H2/e2/N2。選択フィールドの表示行数を指定します。省略した場合は1行のみ表示されるドロップダウンリストになります。 MULTIPLE H2/e2/N2。複数選択を可能にします。 onClick="..." H4/e3。JavaScriptを記述します。NNでは何故か動作しない? onChange="..." H4/e3/N2。JavaScriptを記述します。 onFocus="..." H4/e3/N2。JavaScriptを記述します。 onBlur="..." H4/e3/N2。JavaScriptを記述します。 ACCESSKEY=... H4/e4。例えば ACCESSKEY=X としておくと、キーボードでALTキーを押しながらXキーを押したときにこの部品にフォーカスが移動します。 TABINDEX=... H4/e4。TABキーを押したとき、ここで指定した数値の小さい順番にフォーカスが移動します。 ■ 使用例
<FORM>を参照してください。
■ 説明<SELECT>タグにおいて、選択肢を記述します。 </OPTION>は省略可能です。
■ 属性
属性 説明 SELECTED H2/e2/N2。初期状態として選択状態にします。 VALUE="..." H2/e2/N2。この項目を選択した場合、ここで指定した "..." が入力の値としてアクションに送られます。 ■ 使用例
<FORM>を参照してください。
■ 説明フォームの内容を暗号化して送信するようです。 詳細については未調査。
■ 属性
属性 説明 NAME="..." N2。キーの名前を指定します。 CHALLENGE="..." N2。未稿。
■ 説明フォームのコントロールとラベルを関連つけるためのタグです。 これにより、ラベル部分もマウスのクリックの対象となります。
■ 属性
属性 説明 FOR="..." H4/e4。関連するフォームコントロールのID属性の値を記述します。 ACCESSKEY=... H4/e4。例えば ACCESSKEY=X としておくと、キーボードでALTキーを押しながらXキーを押したときにこの部品にフォーカスが移動したり、ボタンが押された状態になったりします。 ■ 使用例
【HTMLソース】
<INPUT TYPE=checkbox ID=xyz> <LABEL FOR=xyz>ラベル</LABEL>
■ 説明フォームのコントロールをグループ化します。 HTML4.0で規定されたタグで、IE4.0がサポートしています。
■ 使用例
【HTMLソース】
<FORM METHOD=POST ACTION="cgi-bin/xx.cgi"> <FIELDSET> <LEGEND>個人情報</LEGEND> 名前:<INPUT TYPE=text NAME=name> 年齢:<INPUT TYPE=text NAME=age> </FIELDSET> <FIELDSET> <LEGEND>個人環境</LEGEND> OS:<INPUT TYPE=text NAME=os> ブラウザ:<INPUT TYPE=text NAME=browser> </FIELDSET> <INPUT TYPE=submit VALUE="OK"> </FORM>
■ 説明<FIELDSET>でグループ化したコントロール群の表題をつけます。 <TABLE>タグに対する<CAPTION>タグのようなものです。
■ 属性
属性 説明 ALIGN="..." H4/e4。top, bottom, left, rightのいずれかを指定します。 ACCESSKEY="..." H4/e4。例えば ACCESSKEY=X としておくと、キーボードでALTキーを押しながらXキーを押したときにこの<LEGEND>に対応する最初のコントロール部品にフォーカスが移動したり、マウスでクリックされた状態になります。 ■ 使用例
<FIELDSET>を参照してください。