そのほかのフォーム部品について

今回、制作しているWebページで使用していないフォーム部品について説明をします。

ファイル選択フィールドを作成する

ファイル選択フィールドは、フォームからファイルを選択して送信することができます。input要素のtype属性に"file"と指定します。

	<input type="file" name="名前" id="名前" value="">

パスワード入力フィールドを作成する

パスワード入力フィールドは、入力したテキストが自動で半角英数字に変換され、ブラウザ上は*や●のような記号で隠された状態で表示されます。送信されるデータは、入力したテキストがそのまま送られてしまう点に注意してください。データを暗号化して送信する場合は、SSL（暗号化技術）を利用しましょう。input要素のtype属性に"password"と指定します。

	<input type="password" name="名前" id="名前" value="">

隠しフィールドを作成する

隠しフィールドは、ブラウザ上には表示せずに送信するデータを指定できます。input要素のtype属性に"hidden"と指定します。

	<input type="hidden" name="名前" id="名前" value="">

アクセシビリティを考慮したフォームを作成する

tabindex属性に移動する順番を指定することで、tabキーを押した際にフォームのなかの要素を指定した順番に移動するようになります。accesskey属性に、アルファベットや数字など任意のキーを指定すると、指定したキーボードのショートカットを押した際に移動できます。フォーム部品には各属性を指定します。

	<input type="text" name="名前" id="名前" tabindex="移動する順番" accesskey="アクセスキー">

汎用的なボタンを作成する

button要素はボタンを生成します。input要素のボタンと機能に差がないため、一般的には、input要素のボタンがよく使用されています。

	<button type="submit" value="send">送信</button>

その他の要素

fieldset要素は、フォーム部品をグループ化することができます。多くのブラウザは、fieldset要素のまわりに線が引かれます。legend要素は、fieldset要素のキャプションとなります。必ずfieldset要素の開始タグのすぐ後に指定する必要があります。

	<fieldset>
		<legend>キャプション</legend>
		<input type="text" name="名前" id="名前" value="">
	</fieldset>

キャプション