* input 要素型 (HTML, XHTML 1)

[9] [[HTML]] の [DFN[[CODE(HTMLe)[input]] 要素型]]の要素は、
[[フォーム]]の[[制御子]]を定義します。具体的な制御子の種類は、
[CODE(HTMLa)[[[type]]]] 属性によって決まります。

[10]
仕様書:
-[[SI 4281]]:1998
<http://www.qsm.co.il/Hebrew/si4281e.htm>
--[CSECTION[6.1.4 Elements with no directionality]]
--[CSECTION[8.3 Rendering the Form]]
- [[HTML 4]] ([[Web Forms 1.0]])
-- 17.4 The [CODE(HTMLe)[INPUT]] element
<IW:HTML4:"interact/forms.html#edef-INPUT">
- [[device-upload]]
-- ''Form-based Device Input and Upload in HTML'' <http://www.w3.org/TR/device-upload>
- [[WebTV]]
<http://web.archive.org/web/20010425042729/http://developer.webtv.net/authoring/html/input.html#1065149>
- [[Web Forms 2.0]]
-- [CSECTION@en[2.4. Extensions to the [CODE(HTMLe)@en[[[input]]]] element]]
<IW:WF2:"#extensions">
-- [CSECTION@en[2.18. Handling unexpected elements and values]]
<IW:WF2:"#handling">

[11]
:[[開始タグ]]:必須
:[[終了タグ]] (HTML 4):禁止
:終了タグ (XHTML 1):必須
:出現できる文脈:[CODE(SGML)[%[[inline]]]] な文脈
([CODE(HTML)@en[[[hidden]]]] には例外規定あり)
:[[内容模型]]:空 ([[強制空要素]])
:[[属性]]:
,属性名	,属性値	,既定値	,説明	,出典
,[CODE(HTMLa)[[[accept]]]]	,[CODE(SGML)[%[[ContentTypes]]]]	,	,受入れ媒体型	,[HTML 4]
,[CODE(HTMLa)[[[accesskey]]]]	,[CODE(SGML)[%[[Character]]]]	,	,	,[HTML 4]
,[CODE(HTMLa)[[[align]]]]	,	,	,配置	,[HTML 4] 非推奨
,[CODE(HTMLa)[[[alt]]]]	,[CODE(SGML)[%[[Text]]]]	,	,[[代替文]]	,[HTML 4]
,[CODE(HTMLa)[[[autocomplete]]]]	,[CODE(SGML)[[CODE(HTML)[[[on]]]] | [CODE(HTML)[[[off]]]]]]	,	,自動補完	,"[[WinIE 5]]+, [[Web Forms 2.0]]"
,[CODE(HTMLa)[[[border]]]]	,[CODE(SGML)[%[[Pixels]]]]	,	,枠線	,[[NN2]]+
,[CODE(HTMLa)[[[checked]]]]	,([[真偽値属性]])	,([[偽]])	,初期状態	,[HTML 4]
,[CODE(HTMLa)[[[class]]]]	,	,	,[[級]]	,[HTML 4] %[[coreattrs]]
,[CODE(HTMLa)[[[datafld]]]]	,	,	,データ欄	,[HTML 4] 予約
,[CODE(HTMLa)[[[dataformatas]]]]	,	,	,データ書式	,[HTML 4] 予約
,[CODE(HTMLa)[[[datasrc]]]]	,[CODE(SGML)[%[[URI]]]]	,(なし)	,データ源	,[HTML 4] 予約
,[CODE(HTMLa)[[[dir]]]]	,	,	,[[書字方向]]	,[HTML 4] %[[i18n]]
,[CODE(HTMLa)@en[[[directkey]]]],,,,非標準 → [CODE(HTMLa)@en[[[accesskey]]]],[Vodafone]
,[CODE(HTMLa)[[[disabled]]]]	,(真偽値属性)	,(偽)	,無効	,[HTML 4]
,[CODE(HTMLa)[[[dynsrc]]]]	,[CODE(SGML)[%[[URI]]]]	,	,動画資源	,[[WinIE 4]]+
,[CODE(HTMLa)[[[emptyok]]]]	,	,	,空入力可能	,[au]
,[CODE(HTMLa)[[[format]]]]	,	,	,入力書式	,[au]
,[CODE(HTMLa)[[[height]]]]	,	,	,高さ	,[[NN2]]+
,[CODE(HTMLa)[[[id]]]]	,	,	,一意識別子	,[HTML 4] %coreattrs
,[CODE(HTMLa)[[[ismap]]]]	,(真偽値属性)	,(偽)	,鯖側画像写像	,[HTML 4]
,[CODE(HTMLa)[[[istyle]]]]	,	,	,入力モード	,[[iモード]] 2.0
,[CODE(HTMLa)[[[lang]]]]	,	,	,[[自然言語]]	,[HTML 4] %i18n
,[CODE(HTMLa)[[[xml]]:lang]]	,	,	,自然言語	,[XHTML 1]
,[CODE(HTMLa)[[[language]]]]	,	,	,スクリプト言語	,[[WinIE 4]]+
,[CODE(HTMLa)@en[[[localsrc]]]],,,,非標準
,[CODE(HTMLa)@en[[[loop]]]],,,,非標準,[Vodafone]
,[CODE(HTMLa)[[[lowsrc]]]]	,[CODE(SGML)[%[[URI]]]]	,(なし)	,低解像度資源	,[[WinIE 4]]+
,[CODE(HTMLa)@en[[[max]]]],,,[[最大値]],[[WHATWG]] [[WD]],[WF2]
,[CODE(HTMLa)[[[maxlength]]]]	,[CODE(SGML)[[[NUMBER]]]]	,	,最大長	,[HTML 4]
,[CODE(HTMLa)@en[[[min]]]],,,[[最小値]],[[WHATWG]] [[WD]],[WF2]
,[CODE(HTMLa)@en[[[mode]]]],,,,非標準,[Vodafone]
,[CODE(HTMLa)[[[name]]]]	,	,	,制御子名	,[HTML 4]
,[CODE(HTMLa)@en[[[nonumber]]]],,,,非標準,[Vodafone]
,[CODE(HTMLa)[[[onblur]]]]	,[CODE(SGML)[%[[Script]]]]	,	,焦点を失した時	,[HTML 4]
,[CODE(HTMLa)[[[onchange]]]]	,[CODE(SGML)[%[[Script]]]]	,	,現在値変更時	,[HTML 4]
,[CODE(HTMLa)[[[onclick]]]]	,	,	,	,[HTML 4] %[[events]]
,[CODE(HTMLa)[[[ondblclick]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onfocus]]]]	,[CODE(SGML)[%[[Script]]]]	,	,焦点を得た時	,[HTML 4]
,[CODE(HTMLa)[[[onkeydown]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onkeypress]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onkeyup]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onmousedown]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onmousemove]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onmouseout]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onmouseover]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onmouseup]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onselect]]]]	,[CODE(SGML)[%[[Script]]]]	,	,文選択時	,[HTML 4]
,[CODE(HTMLa)@en[[[pattern]]]],,,[[値]]の[[正規表現]],[[WHATWG]] [[WD]],[WF2]
,[CODE(HTMLa)[[[readonly]]]]	,(真偽値属性)	,(偽)	,読取専用	,[HTML 4]
,[CODE(HTMLa)@en[[[required]]]],[[ブール値属性]],[[偽]],[[必須]],[[WHATWG]] [[WD]],[WF2]
,[CODE(HTMLa)@en[[[size]]]],,,[[寸法]],"[[W3C]] [[勧告]], [[WHATWG]] [[WD]] ([[非推奨]])","[HTML 4], [WF2]"
,[CODE(HTMLa)@en[[[soundstart]]]],,,,非標準,[Vodafone]
,[CODE(HTMLa)@en[[[spellcheck]]]],,,,非標準,[[Firefox 2]]
,[CODE(HTMLa)[[[src]]]]	,[CODE(SGML)[%[[URI]]]]	,	,埋込み資源	,[HTML 4]
,[CODE(HTMLa)@en[[[step]]]],,,[[精度]],[[WHATWG]] [[WD]],[WF2]
,[CODE(HTMLa)[[[style]]]]	,	,	,スタイル情報	,[HTML 4] %coreattrs
,[CODE(HTMLa)[[[tabindex]]]]	,[CODE(SGML)[[[NUMBER]]]]	,	,タブ順	,[HTML 4]
,[CODE(HTMLa)[[[title]]]]	,	,	,注釈的題	,[HTML 4] %coreattrs
,[CODE(HTMLa)[[[type]]]]	,[CODE(SGML)[%InputType]]	,[CODE(HTML)[[[text]]]]	,制御子の種類	,[HTML 4]
,[CODE(HTMLa)[[[usemap]]]]	,[CODE(SGML)[%[[URI]]]]	,	,クライアント側画像写像	,[HTML 4]
,[CODE(HTMLa)[[[value]]]]	,	,	,初期値	,[HTML 4]
,[CODE(HTMLa)[[[vcard_name]]]]	,	,	,自動補完	,[[WinIE 5]]+
,[CODE(HTMLa)@en[[[volume]]]],,,,非標準,[Vodafone]
,[CODE(HTMLa)@en[[[viblength]]]],,,,非標準,[Vodafone]
,[CODE(HTMLa)@en[[[vibration]]]],,,,非標準,[Vodafone]
,[CODE(HTMLa)[[[width]]]]	,	,	,幅	,[[NN2]]+


実際に使用できる属性は、 [CODE(HTMLa)[[[type]]]] 属性の値により異なります。

[[#comment]]


** 制御子

[12] [CODE(HTMLe)[input]] 要素は、 [CODE(HTMLa)[type]]
属性の値により、様々な[[制御子]]となります。

,[CODE(HTMLa)@en[[[type]]]] [[属性値]],[[制御子]],状態,出典
,[CODE(HTML)@en[[[add]]]],追加,[[WHATWG]] [[WD]],[WF2]
,[CODE(HTML)[[[button]]]]	,押しボタン制御子	,[HTML 4]
,[CODE(HTML)[[[checkbox]]]]	,チェック箱制御子	,[HTML 4]
,[CODE(HTML)@en[[[date]]]],[[日付]],[[WHATWG]] [[WD]],[WF2]
,[CODE(HTML)@en[[[datetime]]]],[[日時]],[[WHATWG]] [[WD]],[WF2]
,[CODE(HTML)@en[[[datetime-local]]]],[[日時]] ([[地方時]]),[[WHATWG]] [[WD]],[WF2]
,[CODE(HTML)[[[email]]]],[[電子メイル・アドレス]],[[WHATWG]] [[WD]],[WF2]
,[CODE(HTML)[[[file]]]]	,ファイル選択制御子	,[HTML 4]
,[CODE(HTML)[[[hidden]]]]	,隠れ制御子	,[HTML 4]
,[CODE(HTML)[[[image]]]]	,図形的提出ボタン制御子	,[HTML 4]
,[CODE(HTML)[[[month]]]],[[月]],[[WHATWG]] [[WD]],[WF2]
,[CODE(HTML)@en[[[move-down]]]],下に移動,[[WHATWG]] [[WD]],[WF2]
,[CODE(HTML)@en[[[move-up]]]],上に移動,[[WHATWG]] [[WD]],[WF2]
,[CODE(HTML)[[[number]]]],[[数値]],[[WHATWG]] [[WD]],[WF2]
,[CODE(HTML)[[[password]]]]	,単一行文章入力制御子 (入力結果非表示)	,[HTML 4]
,[CODE(HTML)[[[radio]]]]	,ラジオ・ボタン制御子	,[HTML 4]
,[CODE(HTML)[[[range]]]],[[数値]],[[WHATWG]] [[WD]],[WF2]
,[CODE(HTML)@en[[[remove]]]],削除,[[WHATWG]] [[WD]],[WF2]
,[CODE(HTML)[[[reset]]]]	,再設定ボタン制御子	,[HTML 4]
,[CODE(HTML)[[[submit]]]]	,提出ボタン制御子	,[HTML 4]
,[CODE(HTML)[[[text]]]]	,単一行文章入力制御子	,[HTML 4]
,[CODE(HTML)[[[textarea]]]]	,複数行文章入力制御子	,[WebTV]
,[CODE(HTML)[[[time]]]],[[時刻]],[[WHATWG]] [[WD]],[WF2]
,[CODE(HTML)[[[url]]]],[[IRI]],[[WHATWG]] [[WD]],[WF2]
,[CODE(HTML)[[[week]]]],[[週]],[[WHATWG]] [[WD]],[WF2]

[13]
HTML 4 DTD の[[注釈]] (参考) には、
[CODE(HTMLa)@en[[[type]]]] は
[Q[what kind of widget is needed]]
を示すと説明があります。

[15]
[[利用者エージェント]]は、単純に[[文章入力欄]]を表示するのではなく、
それぞれの型に特化した [[widget]] 
を提供することが[['''推奨''']]されています。
[SRC@en[WF2 2.4]]

[16]
[CODE(HTMLa)@en[[[type]]]] が[[動的]]に変更された場合、
[[利用者エージェント]]は新しい [CODE(HTMLa)@en[[[type]]]]
に基づき[[既定値]] ([CODE(HTMLa)@en[[[value]]]]
[[内容属性]]および [CODE(DOMa)@en[[[defaultValue]]]]
[[DOM属性]]) と[[現在値]]
([CODE(DOMa)@en[[[value]]]] [[DOM属性]])、
[CODE(HTMLa)@en[[[min]]]]、[CODE(HTMLa)@en[[[max]]]]、
[CODE(HTMLa)@en[[[step]]]]
を解釈しなおします。新しい [CODE(HTMLa)@en[[[type]]]]
で不適当となった値は、読込み直後の初期状態の決定時と同じように誤り処理規則に従い処理[['''しなければなりません''']]。
[SRC@en[WF2 2.4, 2.4.1, 2.4.2]]


[[#comment]]

** 出現できる文脈

[4] HTML の版によって、 [CODE(HTMLe)[[[form]]]] 要素の子孫でなければならなかったり、
そうでなくても良かったりします。

古い版の HTML に従っている UA、例えば [[Classic Mozilla]]
や [[w3m]] は [CODE(HTMLe)[form]] 外の [CODE(HTMLe)[input]]
を扱えませんから、注意が必要です。

[5] 詳しくは、[[制御子]]の説明をご覧ください。

[[#comment]]

** レンダリング

[17] '''フォーム制御子と内容'''

[[利用者エージェント]]は、[[既定]]では、
[[フォーム制御子]]を[[レンダリング]][['''しなければなりません''']]。
[[内容]]が存在しても、[[レンダリング]][['''してはなりません''']]。
ただし、[[著者]]は [[CSS]] などによりこの動作を上書きできます。
[SRC@en[WF2 2.18]]

[14] '''Bidi との関係''':
[CODE(HTMLe)[[[input]]]] [[要素]]は、 [[bidi]]
的には方向性に関して[[中立]]な[[文字]]1[[文字]]であるかのように扱います。
方向について特に配慮が必要なら
前後に [CODE(char)[[[LRM]]]] や [CODE(char)[[[RLM]]]]
を使えます。 [SRC[SI 4281 6.1.4]]

[[#comment]]

** 歴史

[7] ''WWW-Talk 1992: ISINDEX on documents'' <http://www.webhistory.org/www.lists/www-talk.1992/0291.html>

多分最初の [CODE(HTMLe)[input]] 要素の提案。 [CODE(HTMLe)[[[isindex]]]] 
要素の汎用版として。この時は [[TimBL]] がちょっとなぁって感じで HTML 
仕様には入っていない。

[[#comment]]


** 例

[2] 利用者登録画面の例 [SRC[HTML 4 17.4.2, 17.9.1]]
[PRE(HTML)[
 <FORM action="http://somesite.com/prog/adduser" method="post">
    <P>
    <LABEL for="firstname">First name: </LABEL>
              <INPUT type="text" id="firstname"><BR>
    <LABEL for="lastname">Last name: </LABEL>
              <INPUT type="text" id="lastname"><BR>
    <LABEL for="email">email: </LABEL>
              <INPUT type="text" id="email"><BR>
    <INPUT type="radio" name="sex" value="Male"> Male<BR>
    <INPUT type="radio" name="sex" value="Female"> Female<BR>
    <INPUT type="submit" value="Send"> <INPUT type="reset">
    </P>
 </FORM>
]PRE]

この例では、名前と電子メイル・アドレスを単一行文章入力制御子で記述し、
性別をラジオ・ボタン制御子で選択することを求めています。
記入後、提出ボタンで送信したり、再設定ボタンで初期状態に戻したりできます。

レンダリング例: <IW:HTML4:"images/form_exmpl.gif">

[3] ファイル送信の例 [SRC[HTML 4 17.4.2]]
[PRE(HTML)[
<FORM action="http://server.dom/cgi/handle"
    enctype="multipart/form-data"
    method="post">
 <P>
 What is your name? <INPUT type="text" name="name_of_sender">
 What files are you sending? <INPUT type="file" name="name_of_files">
 </P>
</FORM>
]PRE]

この例では、単一行文章入力制御子で名前を記述させ、
ファイル選択制御子でファイルを選択させて提出することを求めています。

著者は提出ボタンを用意していませんが、 UA 依存の方法で
(または [CODE(HTMLe)[form]] 外にある著者が用意したスクリプト等による提出ボタンで)
利用者が提出することを選ぶと、 HTTP [CODE(HTTP)[[[POST]]]] method により
[CODE(MIME)[[[multipart/form-data]]]] で符号化したフォーム・データ
(名前とファイル) が送信されます。

[[#comment]]


** メモ

[[#comment]]


* メモ