入力フォーム


フォーム

HTML INDEX

●<FORM> 〜 </FORM>

【説 明】

入力フォームは、このタグの範囲内に記述します。このタグはネスト(入れ子)させることはできません。

・ACTION="url"
 「url」には、フォームの内容を処理するCGIのURL や、フォームを送信するE-mailアドレス("mailto:メールアドレス" 形式)を指定します。

・METHOD="要求メソッド"
 「要求メソッド」には、GET・POST が指定できます。

・ENCTYPE="エンコード"
 「エンコード」には、エンコードする方法を指定します。フォームの内容をクライアントからサーバーにファイルとして送信する場合に使用します。

・NAME="フォーム名"
 「フォーム名」は、JavaScriptでフォームを特定するために使用されます。

・TARGET="ウインドウ名"
 「ウインドウ名」には、フォームの内容を送信した結果を表示するウインドウを指定します。指定した名前のウインドウがない場合には、新しいウインドウに表示します。ウインドウの名前は JavaScript で指定することができます。リンク先を特定のフレームに表示させたい場合には、 <FRAME> タグの「NAME=」で指定した値を指定します。

※ターゲットウインドウ名
 ターゲットウインドウの名前は、必ず英数字で始まるものを使用してください。 ここでは、すでに付けられた名前を指定しますが、指定もとでこのように名前を付けていないと、ターゲットウインドウは無視されます。

※特別なターゲットウインドウ名
 以下の4つの名前を指定した場合は、特別な動作をします。
TARGET="_blank"
 名前のない、新しいウインドウにリンクします。
TARGET="_self"
 クリックされたウインドウにリンクします。
TARGET="_parent"
 フレームを使用している場合は、親(<FRAMESET>の1つ上の階層)ウインドウ(フレーム)にリンクします。親ウインドウが存在しない場合は、"_self"と同様に動作します。
TARGET="_top"
 リンク先をウインドウ全体に表示します。フレームを解除する場合に使用します。

【使用例】

<FORM>
  文字入力:<INPUT TYPE="text"><P>
  <INPUT TYPE="button" VALUE="ボタン">
</FORM>

文字入力:


入力形式

HTML INDEX

●<INPUT>

【説 明】

「TYPE=」オプションを使用して、入力する形式を指定します。何も指定しなかった場合には、 "text" が指定されたことになります。

・TYPE="形式"
 「形式」には以下の10種類が指定できます。

 text(文字入力)
 password(パスワード入力)
 radio(ラジオボタン)
 checkbox(チェックボックス)
 hidden(隠しフィールド)
 image(画像の座標入力)
 button(ボタン)
 submit(送信ボタン)
 reset(リセットボタン)
 file(ファイル選択)

・NAME="シンボリック名"
 「シンボリック名」は、画面には表示されませんが、データの名前として使用されます。 submit と reset を除くすべてのタイプに共通です。

・VALUE="文字列"
 「文字列」の意味は、「TYPE=」で指定した形式によって異なります。

 text・password(フィールドの内容のデフォルト)
 radio・checkbox(実際にサーバーに送信される値)
 button・submit・reset(ボタン上に表示される文字)

・SIZE="文字数"
 「文字数」は、text・password 形式で有効です。入力フィールドの長さを指定します。デフォルトは20文字です。

・MAXLENGTH="最大入力可能文字数"
 「最大入力可能文字数」は、text・passwordで有効です。複数行の入力ができる場合は無効となります。

・SRC="url"
 「url」で指定された画像が、ボタンとして表示されます。image 形式でのみ有効です。この画像がクリックされると、その位置の座標とともに他のデータも送信されますので、 submit ボタンは必要ありません。

・CHECKED
 radio・checkbox 形式で有効です。あらかじめ選択された状態にします。

【使用例】

<FORM>

文字入力:<BR>
<INPUT TYPE="text" SIZE=40 VALUE="初期値" MAXLENGTH=20"><P>

</FORM>

文字入力:



<FORM>

パスワード:
<INPUT TYPE="password" SIZE=8 MAXLENGTH=8><P>

</FORM>

パスワード:



<FORM>

<INPUT TYPE="radio" NAME="crab" CHECKED>トゲクリガニ<BR>
<INPUT TYPE="radio" NAME="crab">ヒラツメガニ<BR>
<INPUT TYPE="radio" NAME="crab">サメハダヘイケガニ<BR>

</FORM>

トゲクリガニ
ヒラツメガニ
サメハダヘイケガニ

※ラジオボタンを使用する場合は、「NAME=」で統一した名前をつけるようにしてください。そうしなければ、複数選択できるようになってしまいます。



<FORM>

<INPUT TYPE="checkbox" NAME="crab1" CHECKED>トゲクリガニ<BR>
<INPUT TYPE="checkbox" NAME="crab2">ヒラツメガニ<BR>
<INPUT TYPE="checkbox" NAME="crab3">サメハダヘイケガニ<BR>

</FORM>

トゲクリガニ
ヒラツメガニ
サメハダヘイケガニ



<FORM>
<INPUT TYPE="button" VALUE="ボタン">
</FORM>



<FORM ENCTYPE="multipart/form-data" ACTION="送信先URL" METHOD=POST>

このファイルを送信:<BR>
<INPUT TYPE="file" NAME="fname" SIZE=30>
<P>
<INPUT TYPE="submit" VALUE="送信">

</FORM>

このファイルを送信:

※「ACTION=」には、メールアドレスも指定できます。つまり、ファイルをメールで転送することが可能です。

例)ACTION="mailto:miki@zspc.co.jp"


メニュー・選択リスト

HTML INDEX

●<SELECT> 〜 </SELECT>

【説 明】

ポップアップ・メニューまたは選択リストを表示します。このタグの範囲内で<OPTION>タグを使用して各選択肢を指定します。

・NAME="シンボリック名"
 「シンボリック名」は、画面には表示されませんが、データの名前として使用されます。

・SIZE="選択リストの行数"
 このオプションを使用すると「選択リスト」形式、使用しないと「ポップアップ・メニュー」形式で表示されます。「選択リストの行数」には、選択リストのスクロールしないで表示される行数を指定します。

・MULTIPLE
 複数の項目を選択できるようにする指定です。

【使用例】

<FORM>
<SELECT NAME="crab">
  <OPTION SELECTED>トゲクリガニ
  <OPTION>ヒラツメガニ
  <OPTION>サメハダヘイケガニ
</SELECT>
</FORM>



<FORM>
<SELECT NAME="crabs" SIZE=3 MULTIPLE>
  <OPTION SELECTED>トゲクリガニ
  <OPTION>ヒラツメガニ
  <OPTION>サメハダヘイケガニ
  <OPTION>モクズガニ
  <OPTION>ヨツハモガニ
  <OPTION>コイチョウガニ
  <OPTION>ヒライソガニ
</SELECT>
</FORM>


選択項目

HTML INDEX

●<OPTION>

【説 明】

<SELECT>タグの範囲内で、ポップアップ・メニューまたは選択リストの各選択肢を指定します。

・SELECTED
 デフォルトで選択された状態にします。

・VALUE="文字列"
 「文字列」には、実際にサーバーに送信される値を指定します。

【使用例】

<FORM>
<SELECT NAME="crab">

<OPTION VALUE="Telmessus acutidens">トゲクリガニ

<OPTION VALUE="Ovalipes iridescens">ヒラツメガニ

<OPTION SELECTED VALUE="Paradorippe granulata>サメハダヘイケガニ

</SELECT>

</FORM>


入力フィールド

HTML INDEX

●<TEXTAREA> 〜 </TEXTAREA>

【説 明】

<SELECT>タグの範囲内で、複数行の入力が可能な文字入力フィールドを表示させます。このタグの範囲内に記述した文章がデフォルトで表示されます。

・NAME="シンボリック名"
 「シンボリック名」は、画面には表示されませんが、データの名前として使用されます。

・ROWS="行数

・COLS="1行の文字数"

・WRAP="折り返し方法"
 フィールド内の文字の折り返し方法を指定します。「折り返し方法」には、OFF・VIRTUAL・PHYSICALのいずれかを指定できます。

【使用例】

<FORM>

<TEXTAREA NAME="tarea" ROWS=4 COLS=32>ここには、あなたの町のカニ情報を
入力してください。
札幌近郊の浜辺でも、たくさんの種
類のカニが生息しています。
特に「この時期にこれが取れる」系
の情報をお待ちしています。
</TEXTAREA>

</FORM>



<FORM>
<TEXTAREA WRAP=OFF ROWS=3 COLS=32>This attribute is supported Netscape Navigator 2.0.
</TEXTAREA>
</FORM>



<FORM>
<TEXTAREA WRAP=VIRTUAL ROWS=3 COLS=32>This attribute is supported Netscape Navigator 2.0.
</TEXTAREA>
</FORM>



<FORM>
<TEXTAREA WRAP=PHYSICAL ROWS=3 COLS=32>This attribute is supported Netscape Navigator 2.0.
</TEXTAREA>
</FORM>