input要素(form input)の input は入力という意味でテキスト入力欄、送信・リセットの各種ボタン、チェックボックスなどのフォームのコントロール部品となる入力用オブジェクトを作ります。終了タグはなく、内容をもたない空要素です。どのコントロール部品を作成するかは、type属性で種類を指定します。
入力されたデータの送信先は、コントロール部品をまとめる form要素 の action属性で指定します。HTML4.01 strict, XHTML1.0 strict, XHTML1.1 では form要素の直下にインライン要素である input要素を直接記述することはできません。必ず p要素や div要素などのブロック要素に内包させた形で記述しなければなりません。
type属性の値に "file" が指定されている場合、ウェブサーバーが受け取ることのできる MIMEタイプを限定するように UA に働きかけます。たとえば、CGIプログラムで画像ファイルのみをアップロードできるように取り扱いたい場合は、次のように記述します。
<form action="upload.cgi" method="post"> ...... <input name="imgfile" type="file" accept="image/gif,image/jpeg,image/png">
これは、"image/gif", "image/jpeg", "image/png" の MIMEタイプのファイルを受け入れ、それ以外のファイルがアップロードに指定された場合に、警告用のダイアログを出すように UA に働きかけることが期待されます。しかし、現在 accept属性に対応している UA はありません。
type属性の値に "image" が指定されている場合、イメージボタンとその後に続くテキストの揃え方を指定します。値には次の5つのキーワードがあります。キーワードは半角アルファベットの大文字・小文字が区別されません(case-insensitive)。
align属性は非推奨属性のため、CSS の floatプロパティで左右の配置とその後に続くテキスト(複数行)の揃え方を、vertical-alignプロパティでテキスト(1行)との垂直方向の並びをそれぞれ代替することが推奨されています。また、回り込んだテキストを途中で解除したい場合は br要素に clear属性を指定すれば良いのですが、clear属性も非推奨属性のため、input要素の後に続くブロック要素に clearプロパティを指定すると良いでしょう。
type属性 の値に "image" が指定されている場合に、何らかのトラブルで画像が表示できない場合や音声出力・点字出力などの非視覚環境、画像の表示に対応していない・あるいは表示しない設定にしている環境においても画像の表現する情報を取得できるように、その内容の代替となるテキスト情報を記述します。イメージボタンは送信ボタンとして機能するので、alt="送信" という代替テキストにするのが良いでしょう。
type属性 の値に "radio"、または "checkbox" が指定されている場合に checked属性をつけることで、最初にページを読み込んだ時から、その項目をチェックした状態で表示するように設定します。HTML4.01 では checked、XHTML では属性値を省略できないため checked="checked" と記述します。
フォームのコントロール部品の使用(入力)と選択を全て禁止します。使用が禁止されたコントロール部品の値(value属性の値)は、データ送信時には送信されません。HTML4.01では disabled、XHTML では 属性値を省略できないため disabled="disabled" と記述します。
type属性 の値に "image" が指定されており CGIプログラムを利用したサーバサイド・イメージマップの場合に指定します。ユーザーがボタン用の画像をクリックすると画像の中でクリックされた座標値(x座標, y座標)をウェブサーバーを通してプログラムへと送ります。HTML4.01 では ismap、XHTML では属性値を省略できないため ismap="ismap" と記述します。
type属性 の値に "password"、または "text" が指定されている場合に入力欄に入力できる最大文字数を指定します。ただし、そのウェブページに記述されたフォームを利用する UA に対して文字数を制限するように働きかけるをだけなので、しっかりと CGIプログラム側で入力文字数を制限するようにした方が安全です。
そのコントロールに名前を付けます。データを送信する時に name属性の値とユーザーが入力・選択したデータ(value属性の値)がセットになります。つまり、name属性の値の内容は入力データとともに送信されるため、入力データを受け取ったときに、どの項目に対する回答なのかがわかるように質問の内容を示しておきます。name属性の値は半角アルファベットの大文字・小文字が区別されません(case-insensitive)。
フォームのコントロール部品を読み取り専用にして、そのコントロール部品をユーザー側での入力と変更の操作を禁止します。入力欄にフォーカスできないようにして値の入力と変更を禁止するもので、disabled属性 と違い、あらかじめ設定された値(value属性の値)は送信されます。HTML4.01 では readonly、XHTML では属性値を省略できないため readonly="readonly" と記述します。
コントロール部品の表示幅を指定します。type属性 の値に "password"、または "text" が指定されている場合、size属性の値は文字が隠れずに入力できる表示幅の文字数の指定となります。それ以外のコントロール部品を作成する場合でも指定することは可能ですが効果(影響)はありません。
type属性 の値に "image" が指定されている場合に、表示する画像の所在となる URI を指定します。ボタンに画像を使う場合は何らかのトラブルで画像が表示できない場合や音声出力・点字出力などの非視覚環境、画像の表示に対応していない・あるいは表示しない設定にしている環境のために必ず代替テキストの alt属性 を指定するようにします。
input要素で作るコントロール形式を指定します。type属性の指定がない場合、初期値は "text" です。指定できる値は次の10種類のキーワードがあります。キーワードは半角アルファベットの大文字・小文字が区別されません(case-insensitive)。
詳細は、リンク先の解説とサンプルを参照してください。
type属性 の値に "image" が指定されている場合に、map要素で作成するクライアントサイド・イメージマップ(クリッカッブルマップ)との関連づけをおこなう際に指定します。ハッシュ(#)を前置して、usemap="#名前" という形で、map要素の name属性、または id属性の値を指定します。たとえば、map要素の name属性の値が name="map" であれば、input要素の usmap属性の値は usemap="#map" と指定します。
ただし、XHTML1.1 ではハッシュ(#)を前置する必要はありません。そのため、map要素の id属性の値が id="map" であれば、XHTML1.1 における input要素の usmap属性の値は usemap="map" と ID名だけを指定します。
input要素で連携するイメージマップに Windows版Internet Explorer 6, Windows版Internet Explorer 7、及び Safari は対応していません。
フォームのコントロール部品の初期値を指定します。type属性 の値が "checkbox"、または "radio" の場合は value属性は省略できます。たとえば、type属性 の値に "text" が指定されているテキスト入力欄の場合は UA がページを表示したときの状態ではじめに表示させておくテキストを指定します。そして、値には value="お名前を記入してください" のように、その項目には一体何について記入するのかがわかるように簡潔な説明を記述すると良いでしょう。また、入力欄の前に、または title属性で何について入力するのかを説明したテキストを記述しておけば、値を空(value="")にしておいても良いでしょう。
■押しボタン : <input type="button" ...> ■チェックボックス: <input type="checkbox" ...> ■ファイル選択 : <input type="file" ...> ■隠し項目 : <input type="hidden" ...> ■イメージボタン : <input type="image" src="画像ファイルのURI" alt="代替テキスト" ...> ■パスワード : <input type="password" ...> ■ラジオボタン : <input type="radio" ...> ■リセットボタン : <input type="reset" ...> ■送信ボタン : <input type="submit" ...> ■テキスト入力 : <input type="text" ...>