<INPUT> フォームの構成部品(入力欄・ボタン等)を作成する
<INPUT>タグはテキスト入力欄や実行ボタン等、フォーム(<FORM>〜</FORM>)を構成する部品を作成するタグです。type属性の値により、一行テキストボックス・チェックボックス・ラジオボタン・実行ボタン・リセットボタン等の10種類の異なる部品となります。
属性一覧
- type="text"
- 行テキストボックスをつくります。通常のテキストを入力するフィールドです。2行以上にわたる長い文章を入力させたい場合には、<TEXTAREA>〜</TEXTAREA>を使用します。
- type="password"
- パスワード入力ボックスをつくります。入力したテキストがアスタリスク(*)などに置き換えて表示されます。ただし、データが暗号化されるわけではないので、送信されたデータを受け取ることができれば内容を見ることができます。
- enctype="MIMEタイプ"
- 送信の際のデータ形式(MIMEタイプ)を指定する
- accept-charset="文字セット"
- CGIプログラム等のデータの受け側で受付可能な文字セットを指定する
- type="checkbox"
- チェックボックスをつくります。チェックボックスは複数選択が可能です。checked属性を指定すると、その項目についてはあらかじめチェックの付いた状態となります
- type="radio"
- ラジオボタンをつくります。複数の中から一つしか選択できない点がチェックボックスと異なります。複数を一つのグループとして認識させるには、name属性で同じ名前を付けてください。checked属性を指定すると、その項目についてはあらかじめチェックの付いた状態となります。
- type="file"
- サーバーへファイルを送信する際に、送信するファイルを選択します。ファイル名の入力フィールドと[参照]ボタンが表示されます。サーバー側にはファイルを受け取るための特別なCGI等が必要です。
- type="hidden"
- 隠しデータをサーバーに送信する際に使用します。このタイプのデータは、画面上には表示されませんが、value属性で指定した値がサーバーへ送信されます。
- type="submit"
- 送信ボタンをつくります。
- type="reset"
- リセットボタンをつくります。このボタンを押すと、それまでに入力した情報をキャンセルして初期状態に戻します。
- type="button"
- 汎用ボタンをつくります。
- type="image"
- 画像のボタンをつくります。使用する画像ファイルはsrc属性で指定してください。またalt属性が必須となります。
使用例
HTMLの記述方法
<form action="filename.cgi" method="post">
名前:<input type="text" name="name" size="40"><br>
性別:<input type="radio" name="sex" value="male">男
<input type="radio" name="sex" value="female">女<br>
血液型:<select name="blood">
<option value="A">A型</option>
<option value="B">B型</option>
<option value="O">O型</option>
<option value="AB">AB型</option>
</select><br>
ご感想:<br>
<textarea name="kanso" rows="4" cols="40"></textarea><br>
<input type="submit" value="送信"> <input type="reset" value="リセット">
</form>
ブラウザではこう見えます