input

提供: ASCII.jp HTMLリファレンス

ver.8~ ver.7~ ver.14~ ver.5.1~ ver.11.5~
意味 各種の入力
読み方 インプット

カテゴリー

フロー・コンテンツ
フレージング・コンテンツ
type属性がhiddenでなければ、インタラクティブ・コンテンツ
type属性がhiddenでなければ、リスト化/ラベル付け可能/送信可能/リセット可能なフォーム関連要素
type属性がhiddenなら、リスト化/送信可能/リセット可能なフォーム関連要素

親にできる要素/カテゴリー

フレージング・コンテンツが期待される場所

子にできる要素/カテゴリー

<input 属性="値">

属性 概要
type 文字列 フィールドのタイプ
autofocus 論理値 自動フォーカスするかどうか
form 文字列 関連付けるフォームのID
その他多数 type属性の値ごとに解説

 type属性の値に応じて、指定できる属性が異なります。詳しくは、type属性ごとのページを参照してください。

グローバル属性

accesskey,class,contenteditable,contextmenu,dir,draggable,hidden,id,lang,spellcheck,style,tabindex,title

説明

 input要素は、データ入力用の各種のフィールドを表します。

 type属性で、入力できるデータのタイプを指定します。type属性に指定できる値は以下の表の通りです。なお、type属性を指定しなかった場合は、「text」を指定したことになります。

キーワード 入力可能な値 コントロールのタイプ
hidden 任意の文字列 なし
text 改行を含まない文字列 テキスト
search 改行を含まない文字列 検索
tel 改行を含まない文字列(電話番号) テキスト
url 絶対URI テキスト
email 単一または複数のメールアドレス テキスト
password 改行を含まない文字列(重要な情報) 入力したデータを隠すテキスト
datetime タイムゾーンがUTCに設定された日付と時刻 日付と時刻
date タイムゾーンを含まない日付 日付
month タイムゾーンを含まない年と月
week タイムゾーンを含まない年と週番号
time タイムゾーンを含まない時刻 時刻
datetime-local タイムゾーンを含まない日付と時刻 日付と時刻
number 数値 テキストまたはスピナー
range 一定範囲の数値 スライダー
color sRGBカラー カラー
checkbox 事前に定義された0個以上の値 チェックボックス
radio 列挙された値 ラジオボタン
file 0個以上のファイル ラベルとボタン
submit 列挙された値 ボタン
image クリックされた位置の座標 クリック可能なイメージかボタン
reset なし ボタン
button なし ボタン

 type属性の値によって、入力できる値や、コントロールの見た目が異なります。HTML5ではtype属性に指定できる値が大幅に増えていて、まとめて解説すると複雑になりますので、type属性の値ごとに個々のページで詳細を解説します。

 autofocus属性は論理属性で、この属性を指定したコントロールは、ページの読み込みが終わった時点でフォーカスされます。1つの文書の中で、autofocus属性があるコントロールは1つしか存在できません。

 form属性では、input要素が属するフォームのIDを明示することができます。

サンプル

(body要素の内部のみ掲載)

<form action="server.cgi" method="post">
<p><label>ユーザー名:<input type="text" name="username"></label></p>
<p><label>パスワード:<input type="password" name="pass"></label></p>
<p><input type="submit" value="送信"></p>
</form>

サンプル実行画像

Powered by Web Professional

目次