* [CODE(HTMLe)@en[form]] 要素 (HTML)

[23] [[HTML]] の [DFN[[CODE(HTMLe)[form]] 要素]]は、
[[フォーム]]の[[包含子]]です。フォームの配置と提出先・提出方法を記述します。

[24]
仕様書:
- [[HTML 4]] ([[Web Forms 1.0]])
-- 17.3 [CODE(HTMLe)[FORM]] element
<IW:HTML4:"interact/forms.html#edef-FORM">
- [[XHTML 1.0]]
<http://www.w3.org/TR/xhtml1/#prohibitions>
- [[Web Forms 2.0]]
-- [CSECTION@en[2.3. Changes to existing controls]]
<IW:WF2:"#changes">
-- [CSECTION@en[2.18. Handling unexpected elements and values]]
<IW:WF2:"#handling">
--<http://www.whatwg.org/specs/web-forms/current-work/#additions>

[25]
:状態:[[W3C]] [[勧告]]
:[[名前空間URI]]:[CODE(URI)@en[[[http://www.w3.org/1999/xhtml]]]]
:[[局所名]]:[CODE(HTMLe)@en[[[form]]]]
([Q@en[[RUBYB[[[フォーム]]] [[[form]]]]より)]]
:[[開始タグ]]:必須
:[[終了タグ]]:必須
:[[内容モデル]]:零個以上の[[ブロック水準要素]]
(例外規定あり: >>39)
:出現できる文脈:
[[ブロック水準要素]]が認められる場所、または
[CODE(HTMLe)@en[[[head]]]] の[[子供]]として
:[[属性]]:
,[[属性名]]	,[[属性値]]	,[[既定値]]	,説明	,状態	,出典
,[CODE(HTMLa)[[[accept]]]]	,[CODE(SGML)[%[[ContentTypes]]]]	,	,受入れ媒体型	,[HTML 4]
,[CODE(HTMLa)[[[accept-charset]]]]	,[CODE(SGML)[%[[Charsets]]]]	,	,受入れ [[charset]]	,[HTML 4]
,[CODE(HTMLa)[[[action]]]]	,[CODE(SGML)[%[[URI]]]]	,(必須)	,フォーム処理器	,[HTML 4]
,[CODE(HTMLa)@en[[[autocomplete]]]]	,	,	,[[自動補完]]	,非標準	,[[WinIE]]
,[CODE(HTMLa)[[[class]]]]	,	,	,[[級]]	,[HTML4] %[[coreattr]]
,[CODE(HTMLa)[[[dir]]]]	,	,	,[[書字方向]]	,[HTML4] %[[i18n]]
,[CODE(HTMLa)[[[enctype]]]]	,[CODE(SGML)[%[[ContentType]]]]	,	,提出媒体型	,[HTML 4]
,[CODE(HTMLa)[[[id]]]]	,	,	,一意識別子	,[HTML4] %coreattr
,[CODE(HTMLa)[[[lang]]]]	,	,	,[[自然言語]]	,[HTML4] %i18n
,[CODE(HTMLa)[[[xml]]:lang]]	,	,	,自然言語	,[XHTML1]
,[CODE(HTMLa)@en[[[lcs]]]]	,	,	,	,非標準	,[[iモード]]
,[CODE(HTMLa)@en[[[measure]]]],,,,非標準,[[EMOBILE]]
,[CODE(HTMLa)[[[method]]]]	,	,[CODE(HTML)[[[get]]]]	,提出方式	,[HTML 4]
,[CODE(HTMLa)[[[name]]]]	,	,	,フォーム名	,[HTML 4]
,[CODE(HTMLa)[[[onclick]]]]	,	,	,	,[HTML4] %[[events]]
,[CODE(HTMLa)[[[ondblclick]]]]	,	,	,	,[HTML4] %events
,[CODE(HTMLa)[[[onkeydown]]]]	,	,	,	,[HTML4] %events
,[CODE(HTMLa)[[[onkeypress]]]]	,	,	,	,[HTML4] %events
,[CODE(HTMLa)[[[onkeyup]]]]	,	,	,	,[HTML4] %events
,[CODE(HTMLa)[[[onmousedown]]]]	,	,	,	,[HTML4] %events
,[CODE(HTMLa)[[[onmousemove]]]]	,	,	,	,[HTML4] %events
,[CODE(HTMLa)[[[onmouseout]]]]	,	,	,	,[HTML4] %events
,[CODE(HTMLa)[[[onmouseover]]]]	,	,	,	,[HTML4] %events
,[CODE(HTMLa)[[[onmouseup]]]]	,	,	,	,[HTML4] %events
,[CODE(HTMLa)[[[onreset]]]]	,[CODE(SGML)[%[[Script]]]]	,	,フォーム[[再設定]]時	,[HTML 4]
,[CODE(HTMLa)[[[onsubmit]]]]	,[CODE(SGML)[%[[Script]]]]	,	,フォーム[[提出]]時	,[HTML 4]
,[CODE(HTMLa)@en[[[runat]]]]	,[CODE(HTML example)@en[[[server]]]]	,	,	,非標準
,[CODE(HTMLa)[[[style]]]]	,	,	,スタイル情報	,[HTML4] %coreattr
,[CODE(HTMLa)[[[subject]]]]	,[CODE(SGML)[%[[Text]]]]	,	,主題	,
,[CODE(HTMLa)[[[target]]]]	,[CODE(SGML)[%[[FrameTarget]]]]	,	,対象フレーム	,[HTML 4] 非推奨
,[CODE(HTMLa)[[[title]]]]	,	,	,注釈的題	,[HTML4] %coreattr
,[CODE(HTMLa)@en[[[utn]]]]	,([[ブール型属性]])	,([[偽]])	,製造番号送信	,非標準	,[[iモード]]
,[CODE(HTMLa)@en[[[z]]]]	,([[真偽値属性]])	,([[偽]])	,	,非標準	,[Vodafone]


[29]
HTML 4 DTD [[注釈]] (参考) では
[Q[interactive form]] (対話的フォーム)
と説明されています。

[59] [[とほほ]]では [CODE(HTMLa)@en[[[urn]]]]
[[属性]]が紹介されていますが、
[CODE(HTMLa)@en[[[utn]]]] の誤りと見られます。

;; [CITE[<form> - フォーム]] ([CODE[2006-10-01 23:42:22 +09:00]] 版) 
<http://www.tohoho-web.com/html/form.htm>


** 内容

[26] [CODE(HTMLe)[form]] 要素の内容としては、
フォームの[RUBYB[配置] [layout]]を記述します [SRC[HTML 4 17.3]]。
具体的には、フォーム外同様の通常の[[内容]]・[[マーク]]に加えて、
フォーム[[制御子]]やフォーム制御子の[RUBY[札] [ラベル]]を記述できます。

[11] [CODE(HTMLe)[[[input]]]] 要素などは[[行内要素]]扱いですから、
直接内容に持つことは'''出来ません'''ので注意が必要です。 
(Transitional とかだと話は別ですが。) [CODE(HTMLe)[[[form]]]]
の直接の子供になれるのは [CODE(HTMLe)[[[p]]]]
要素などの[[ブロック水準要素]]です。

[31]
[CITE[HTML Working Group Voyager Issue Tracking System - Modularization-abstractions/591]] <http://hades.mn.aptest.com/cgi-bin/voyager-issues/Modularization-abstractions?id=591>

> Should we intentionally attempt to support the legacy content models in the
legacy redecl module?
> No - it _could_ break compatibility, and we don't want to do that in a second
edition.

([[名無しさん]] [sage] [WEAK[2006-02-15 08:59:39 +00:00]])

[[#comment]]


*** HTML 5 内容モデル

[39] [[Web Forms 2.0]] では、次の[[内容]]が認められています
[SRC@en[WF2 2.3]]:
- [[空要素]]にする。
-- [CODE(HTMLe)@en[[[form]]]] は[[空]]に[['''して構いません''']]。
-- [CODE(HTMLe)@en[[[head]]]] 内の [CODE(HTMLe)@en[[[form]]]]
は[[空]]にしなければなりません。
- [[ブロック水準要素]]だけを[[子供]]とする。
-- 原則として、 [CODE(HTMLe)@en[[[form]]]]
の[[子供]]は[[ブロック水準要素]]と[['''しなければなりません''']]。
- [[行内水準内容]]だけを[[子供]]とする。
-- [CODE(HTMLe)@en[[[form]]]] [[要素]]の[[祖先]]の1つが
[[ブロック水準要素]]と[[行内水準内容]]の両方を認めていて、
-- しかもそれが [CODE(HTMLe)@en[[[div]]]] [[要素]]では''ない''場合。

[[#comment]]


*** 空要素

[32]
[[Web Forms 2.0]] では、 [CODE(HTMLe)@en[[[form]]]]
[[要素]]は[[空]]に[['''して構いません''']]。
また、[[空]]のとき、 [CODE(HTMLe)@en[[[head]]]]
内に入れることができます (>>33)。
[SRC@en[WF2 2.3]]

[[#comment]]


*** [CODE(HTMLe)@en[form]] の入れ子

[16] [CODE(HTMLe)[form]] 要素の子孫に [CODE(HTMLe)[form]] 要素は存在できません
[SRC[XHTML 1.0]]。

[36]
[[Web Forms 2.0]] では、 [CODE(HTMLe)@en[[[form]]]]
を [CODE(HTMLe)@en[[[form]]]]
の[[子孫]]にすることが認められています。
[SRC@en[WF2 2.3]]

[37] '''HTML 直列化'''

([[XHTML]] ではなく) [[HTML]] では、
[CODE(HTMLe)@en[[[form]]]] [[要素]]内の
[CODE(HTML)@en[<[CODE(HTMLe)@en[[[form]]]]>]]
[[開始タグ]]は虫されるのが普通なので、
[CODE(HTMLe)@en[[[form]]]] の[[入れ子]]は認められていません。
[SRC@en[WF2 2.3]]

;; [[HTML]] として[[構文解析]]した[[文書]]でも、
[[DOM]] を通じて [CODE(HTMLe)@en[[[form]]]]
内に [CODE(HTMLe)@en[[[form]]]] を入れることはできます。

[38] '''フォーム間の関係'''

[[入れ子]]にしても、[[フォーム]]間に意味的な関係はありません。
[[フォーム制御子]]は通常直近の[[祖先]]である[[フォーム]]だけに関連付けられます。
[[フォーム]]関連の[[属性]]や[[事象]]も、
[WEAK[([[DOM]] で規定された通常通りの[[事象]]の[[泡立ち]]はありますが)]]
どちらかの[[フォーム]]だけに関係します。

[[#comment]]


*** メモ

[[#comment]]


** 文脈


*** [CODE(HTMLe)@en[head]] の子供

[33]
[CODE(HTMLe)@en[[[form]]]] は、[[内容]]が[[空]]の場合に限り、
[CODE(HTMLe)@en[[[head]]]] の[[子供]]とすることができます。
[SRC@en[WF2 2.3]]

[34]
[[Web Forms 2.0]] で導入された [CODE(HTMLa)@en[[[form]]]]
[[属性]]により、[[フォーム制御子]]は [CODE(HTMLe)@en[[[form]]]]
外であっても特定の [CODE(HTMLe)@en[[[form]]]]
と関連付けることができるようになりました。
従いまして、[[フォーム制御子]]は直接 [CODE(HTMLe)@en[[[body]]]]
の子孫とし、それに対応する [CODE(HTMLe)@en[[[form]]]]
[[要素]]は [CODE(HTMLe)@en[[[head]]]] [[要素]]に入れるという使い方ができます。

;; これは、 [[XForms]] の[[フォーム]]の定義方法とも似ています。

[35] '''HTML 直列化との関係'''

([[XHTML]] ではなく) [[HTML]] では、
[CODE(HTML)@en[<[CODE(HTMLe)@en[[[form]]]]>]]
[[開始タグ]]が出現すると [CODE(HTMLe)@en[[[body]]]]
[[要素]]が[[開いている]]と[[構文解析]]されてしまいます。

例えば、
[PRE(HTML example code)[
<html>
<head>
<title>空の form の例</title>
<form></form>
<h1>空の <code lang="en">form</code> の例</h1>
</body>
</html>
]PRE]

は
[PRE(HTML example code)[
<html>
<head>
<title>空の form の例</title>
'''</head><body>'''<form></form>
<h1>空の <code lang="en">form</code> の例</h1>
</body>
</html>
]PRE]

と解釈されてしまいます。

;; そう解釈されても[[フォーム]]としての機能は変わりありませんが、
[[DOM]] による操作や [[CSS]] による[[レンダリング]]などでの扱いが変わります。
また、他の[[要素]]の[[タグ]]の位置によっては[[文書]]が[[不適合]]となります。

;; [[HTML]] として[[構文解析]]した[[文書]]でも、
後から [[DOM]] により [CODE(HTMLe)@en[[[head]]]]
内に [CODE(HTMLe)@en[[[form]]]] を入れることはできます。

[[#comment]]


*** メモ

[[#comment]]


** レンダリング

[57] '''[CODE(HTMLe)@en[head]] 内の非空 [CODE(HTMLe)@en[form]]'''

通常[[利用者エージェント]]は [CODE(HTMLe)@en[[[head]]]]
[[要素]]の[[内容]]を[[レンダリング]]しませんから、
[[空]]でない [CODE(HTMLe)@en[[[form]]]]
が [CODE(HTMLe)@en[[[head]]]] 内に含まれていても、
特別な処理は必要ありません。
[[CSS]] 等により [CODE(HTMLe)@en[[[head]]]]
[[要素]]内の [CODE(HTMLe)@en[[[form]]]]
を[[レンダリング]]することにした場合、
[CODE(HTMLe)@en[[[form]]]] は通常通り
([CODE(HTMLe)@en[[[body]]]] 内と同じように)
動作[['''しなければなりません''']]。
[SRC@en[WF2 2.18]]

[[#comment]]


** 安全性

[[フォーム]]の安全性の項を参照。


** 例

[27] 単純なフォームの例 [SRC[HTML 4 27.3、改]]
[PRE(HTML)[
 <FORM action="http://somesite.example/prog/adduser" method="post">
 ...form contents...
 </FORM>
]PRE]

このフォームの場合、提出すると [SAMP(URI)[adduser]]
というフォーム処理エージェントに [[HTTP]] [CODE(HTTP)[[[POST]]]]
を使ってフォームのデータを送信します。

[[#comment]]


** 実装

[21] 伝統的にフォームの各欄に入力していても、
提出しないでブラウザを閉じたり他の頁に移動したりしたときに、
ブラウザは何も言ってくれません。頁移動はともかく、閉じてしまったら、
入力途中のデータは失われます。これって不親切だと思いませんか。
[WEAK[っていうか、間違って終了させちゃったんだよなあ。。。書きかけのデータが水の泡。。。]]

[22] >>21 とりあえず[[著者]]ができることとして、 [CODE(HTMLa)[[[onunload]]]] で 
check して終了をとめられないかなあ。

[28] 途中で別の作業が入って、また後から続きを・・・
と言うこともあるので、ブラウザに中途保存機能がついていると便利かも。
最近のブラウザはフォームの自動[[補完]]機能がついているものが多いですから、
利用者が意図的に保存できても良いはずです。

(嘆かわしいことですがブラウザや環境が突然動かなくなることがたまにありますから、
こまめに保存できるといいですよね。自動保存だとなお良い。)

[60]
[CITE[IE6 Form Tag Orphans by jpsykes]] ([CODE[2007-09-29 12:45:21 +09:00]] 版) <http://jpsykes.com/92/ie6-form-tag-orphans>
([[名無しさん]])

[[#comment]]


** 不思議解釈

[14] [CODE(HTMLe)[form]] 要素の典型的な[[既定スタイル・シート]]でのレンダリングでは
[CODE(HTMLe)[form]] 要素の周囲に余白が空くことがあるので、 
[CODE(HTMLe)[[[td]]]] 要素の内容にするときには [CODE(HTML)[<[CODE(HTMLe)[form]]>]] 
[[タグ]]を [CODE(HTML)[<[CODE(HTMLe)[td]]>]] タグの外に出すといい、
という素晴らしき[[不思議マーク付け]]の[[裏技]]があるそうです。

[30]
[CITE@en[nodeType 8 and getElementsByTagName - Anne’s Weblog about Markup & Style]]
<http://annevankesteren.nl/2005/10/msn-sessions>

[[WinIE 6]] が [CODE(HTMLe)@en[[[form]]]] [[タグ]]のところで (も)
滅茶苦茶な[[文書木]] (のようなもの) を作るというお話。
([[名無しさん]] [WEAK[2005-10-31 00:10:13 +00:00]])

[[#comment]]


** メモ

- [17] [CODE(URI)[[[mailto:]]]] URI のとき、 [[NN2]] はその宛先のメイル作成画面を開きますが、それ以上は何もしてくれません。 (入力欄の値はまったく反映されません。)

[18] >>17 [[NC]]4.01 で試してみたら、同じ結果になりました。でも電子メイルで送信します云々の警告は出るので、対応はしてるはずなんですが。謎です。

- [20] >>17 のようなのはブラウザと MUA の相性で今でもよくあることみたいです。というわけで、 [[JavaScript]] を使って無理矢理送らせる方法 : ''フォームの送信について'' <http://www.parkcity.ne.jp/~chaichan/qanda/qa4468.htm>。非本質的で呆れて物も言えなくなるような汚いやり方で、よくもまあこんなの思いつくなあという感じではありますが、誰も [CODE(HTML)[form]] + [CODE(URI)[mailto:]] を標準化しようとしない以上どうしようもないのかも。

* メモ

[62] [CITE@en[(X)HTML5 Tracking]]
([TIME[2009-08-23 15:37:15 +09:00]] 版)
<http://html5.org/tools/web-apps-tracker?from=2420&to=2421>

[63] [CITE@en[(X)HTML5 Tracking]]
([TIME[2009-08-23 15:37:38 +09:00]] 版)
<http://html5.org/tools/web-apps-tracker?from=2527&to=2528>

[64] [CITE@en[(X)HTML5 Tracking]]
([TIME[2009-08-23 15:38:11 +09:00]] 版)
<http://html5.org/tools/web-apps-tracker?from=2525&to=2526>

[65] [CITE@en-GB-x-Hixie[Web Forms 2.0]]
([TIME[2009-01-05 20:07:15 +09:00]] 版)
<http://www.whatwg.org/specs/web-forms/current-work/#form0>

[66] [CITE@en[(X)HTML5 Tracking]]
([TIME[2009-10-23 23:26:25 +09:00]] 版)
<http://html5.org/tools/web-apps-tracker?from=4287&to=4288>

[67] [CITE[Bug 7978 – Form foster parenting introduces extra space to layout]]
([TIME[2009-10-23 23:27:12 +09:00]] 版)
<http://www.w3.org/Bugs/Public/show_bug.cgi?id=7978>

[68] [CITE@en[(X)HTML5 Tracking]]
([TIME[2010-01-06 23:29:38 +09:00]] 版)
<http://html5.org/tools/web-apps-tracker?from=4521&to=4522>

[69] [CITE[IRC logs: freenode / #whatwg / 20100404]]
([TIME[2010-04-19 08:25:38 +09:00]] 版)
<http://krijnhoetmer.nl/irc-logs/whatwg/20100404#l-150>

[70] [CITE['''['''whatwg''']''' Constraint validation feedback (various threads)]]
([TIME[2010-08-12 07:41:12 +09:00]] 版)
<http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2010-August/027882.html>

[71] [CITE@en[Opera: Opera 11.00 for Windows changelog]]
( ([[Frank M. Palinkas, Technical Writer, Opera Software ASA]] 著, [TIME[2011-04-24 11:17:12 +09:00]] 版))
<http://www.opera.com/docs/changelogs/windows/1100/>

[72] [CITE@en[Web Applications 1.0 r6221      Remove <progress form> and <meter form> since they are basically useless.]]
( ([TIME[2011-06-14 09:33:00 +09:00]] 版))
<http://html5.org/tools/web-apps-tracker?from=6220&to=6221>

[73] [CITE@en[Web Applications 1.0 r6727     Try to make the named getter on HTMLFormElement more Web-compatible.]]
( ([TIME[2011-10-22 06:32:00 +09:00]] 版))
<http://html5.org/tools/web-apps-tracker?from=6726&to=6727>

[74] [CITE[''''''[''''''whatwg'''''']'''''' Session Management]]
( ([TIME[2012-01-11 08:08:33 +09:00]] 版))
<http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2012-January/034331.html>