入力コントロールを表示する
input
<
input
フォームにおける入力コントロール(入力欄)を表します。type属性の値に入力コントロールの種別を指定することで、さまざまな入力コントロールを表示できます。
カテゴリー | type属性値がhiddenでない場合 ・インタラクティブコンテンツ ・パルパブルコンテンツ ・リスト、ラベル付け、サブミット、リセット可能なフォーム関連要素 type属性値がhiddenの場合 ・リスト、サブミット、リセット可能なフォーム関連要素 |
---|---|
コンテンツモデル | 空 |
使用できる文脈 | フレージングコンテンツが期待される場所 |
使用できる属性
サーバーが受け取ることが可能なファイルの種別を指定します。値には、MIMEタイプまたは拡張子を指定できます。複数の値をカンマ(,)で区切って指定することも可能です。
ボタン画像の代替テキストを指定します。
オートコンプリートの可否を以下の2つの値で指定できます。
on | オートコンプリートを行います(初期値)。 |
---|---|
off | オートコンプリートを行いません。 |
フォーカスをコントロールします。Webページが読み込まれた際、この属性を持つ入力コントロールにフォーカスを移動させます。autofocus属性は論理属性です。
指定された項目をあらかじめ選択した状態にします。checked属性は論理属性です。
送信するデータの書字方向に関するクエリ値のクエリ名を指定します。
フォームの入力コントロールを無効にします。disabled属性は論理属性です。
任意のform要素に付与したid属性値を指定することで、そのフォームとこの属性を持つ入力コントロールを関連付けできます。
この属性を持つ入力コントロールが関連付けられているform要素のaction属性値を上書きできます。
この属性を持つ入力コントロールが関連付けられているform要素のenctype属性値を上書きできます。
この属性を持つ入力コントロールが関連付けられているform要素のmethod属性値を上書きできます。
この属性を持つ入力コントロールが関連付けられているform要素のnovalidate属性値を上書きできます。
この属性を持つ入力コントロールが関連付けられているform要素のtarget属性値を上書きできます。
入力コントロールの高さを指定します。値は正の整数のみ指定できます。
入力コントロールにデータが入力されるときに表示する入力候補リストを指定します。入力候補リストは、同一文書内に記述したdatalist要素で定義し、list属性の値は対象としたいdatalist要素に付与したid属性の値を指定します。
入力コントロールに対して入力可能な値の最大値を指定します。
入力コントロールに入力可能な文字列の最大文字数を指定します。この属性を指定することで、「○文字以内」という入力制限を付けることができます。
入力コントロールに対して入力可能な値の最小値を指定します。
選択肢の複数選択を可能にします。select要素の選択肢やアップロードするファイルを[Ctrl]キーなどを押しながらクリックすることで、複数の対象を選択できます。multiple属性は論理属性です。
データが送信される際のクエリ名を指定します。
入力された内容が正しいかを、JavaScriptの正規表現によって検証します。この正規表現は完全一致のみになります。ただし、以下の条件においてこの属性は無視され、検証は行われません。
- 関連付けられたform 要素にnovalidate属性が付与され、入力内容の検証が無効になっている
- 同じ入力コントロールにdisabled属性、またはreadonly属性が付与されている
入力コントロールにあらかじめ表示されるダミーテキスト(プレースホルダー)を指定します。値には改行コードを含むことはできません。
フォームの入力コントロールを閲覧者が編集できないように指定します。readonly属性が指定されると、閲覧者は入力コントロールの値を変更できなくなりますが、フォーム送信時に値は送信されます。また、この属性が指定されたinput要素は、pattern属性による入力内容の検証対象から除外されます。
入力コントロールへのデータ入力や選択を必須とします。この属性が指定された入力コントロールに値がない場合、対応するブラウザーではフォームの送信が行われません。ただし、以下の条件においてこの属性は無視されます。required属性は論理属性です。
- 関連付けられたform要素にnovalidate属性が指定されている、または送信ボタンにformnovalidate属性が指定され、入力内容の検証が無効になっている
- 同じ入力コントロール要素にdisabled属性、またはreadonly属性が付与されている
ブラウザーが入力コントロールを表示する際のサイズ(文字数)を指定します。1以上の正の整数を値として入力でき、指定した文字数分を初期状態で表示できるように入力コントロールのサイズが調整されます。
入力コントロールに埋め込む画像やスクリプトなど、外部リソースのURLを指定します。
入力コントロールに対して入力可能な値の最小単位を指定します。例えば、input type="number"で数値を入力するとき、step="5"と指定すれば、5の倍数となる数値しか入力できなくなります。
属性値に以下のキーワードを指定することで、入力コントロールの種別を指定します。詳細は各属性値のページで解説しています。
submit | 送信ボタン |
---|---|
image | 画像形式の送信ボタン |
reset | 入力内容のリセットボタン |
hidden | 閲覧者には表示しないデータ |
text | 1行テキストの入力欄(初期値) |
search | 検索キーワードの入力欄 |
tel | 電話番号の入力欄 |
url | URLの入力欄 |
メールアドレスの入力欄 | |
password | パスワードの入力欄 |
datetime | 日時の入力欄(タイムゾーンはUTC) |
month | 月の入力欄 |
week | 週の入力欄 |
date | 日付の入力欄 |
time | 時間の入力欄 |
number | 数値の入力欄 |
range | 数値の入力欄(厳格でない大まかな数値) |
checkbox | チェックボックス(複数選択可能) |
radio | ラジオボタン(1つだけ選択可能) |
file | 送信するファイルの選択 |
bottum | スクリプト言語起動用のボタン |
color | RGBカラーの入力欄 |
入力コントロールの初期値を指定します。フォームが送信される際、type属性値がhiddenの場合やreadonly属性が指定されている場合は、この値がそのまま送信されます。閲覧者が初期値を変更した場合は、変更後の値が送信されます。type属性値がcheckboxまたはradioの場合は、選択された項目に指定されたvalue属性の値が送信されます。指定されていない場合は、空の値が送信されます。また、type属性値がsubmit、image、reset、buttonの場合は、value属性の値が表示されるボタン名となります。
入力コントロールの幅を指定します。値は正の整数のみ指定できます。
グローバル属性
すべての要素で使用できる属性です。
グローバル属性とイベントハンドラ属性