[23]

HTML の form 要素は、フォームの包含子です。フォームの配置と提出先・提出方法を記述します。

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

属性

[12]

form 要素の内容属性

z<form z>

属性名	属性値	既定値	説明	状態	出典
`accept`	`%ContentTypes`		受入れ媒体型	[HTML 4]
`accept-charset`	`%Charsets`		受入れ charset	[HTML 4]
`action`	`%URI`	(必須)	フォーム処理器	[HTML 4]
`autocomplete`			自動補完	非標準	WinIE
`class`			級	[HTML4] %coreattr
`dir`			書字方向	[HTML4] %i18n
`enctype`	`%ContentType`		提出媒体型	[HTML 4]
`id`			一意識別子	[HTML4] %coreattr
`lang`			自然言語	[HTML4] %i18n
`xml:lang`			自然言語	[XHTML1]
`lcs`				非標準	iモード
`measure`				非標準	EMOBILE
`method`		`get`	提出方式	[HTML 4]
`name`			フォーム名	[HTML 4]
`onclick`				[HTML4] %events
`ondblclick`				[HTML4] %events
`onkeydown`				[HTML4] %events
`onkeypress`				[HTML4] %events
`onkeyup`				[HTML4] %events
`onmousedown`				[HTML4] %events
`onmousemove`				[HTML4] %events
`onmouseout`				[HTML4] %events
`onmouseover`				[HTML4] %events
`onmouseup`				[HTML4] %events
`onreset`	`%Script`		フォーム再設定時	[HTML 4]
`onsubmit`	`%Script`		フォーム提出時	[HTML 4]
`runat`	`server`			非標準
`style`			スタイル情報	[HTML4] %coreattr
`subject`	`%Text`		主題
`target`	`%FrameTarget`		対象フレーム	[HTML 4] 非推奨
`title`			注釈的題	[HTML4] %coreattr
`utn`	(ブール型属性)	(偽)	製造番号送信	非標準	iモード

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

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

内容

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

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

[31] 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] 2006-02-15 08:59:39 +00:00)

HTML 5 内容モデル

[39] Web Forms 2.0 では、次の内容が認められています WF2 2.3:

空要素にする。
- form は空にして構いません。
- head 内の form は空にしなければなりません。
ブロック水準要素だけを子供とする。
- 原則として、 form の子供はブロック水準要素としなければなりません。
行内水準内容だけを子供とする。
- form 要素の祖先の1つがブロック水準要素と行内水準内容の両方を認めていて、
- しかもそれが div 要素ではない場合。

空要素

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

`form` の入れ子

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

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

[37] HTML 直列化

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

HTML として構文解析した文書でも、 DOM を通じて form 内に form を入れることはできます。

[38] フォーム間の関係

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

メモ

文脈

`head` の子供

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

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

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

[35] HTML 直列化との関係

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

例えば、

<html>
<head>
<title>空の form の例</title>
<form></form>
<h1>空の <code lang="en">form</code> の例</h1>
</body>
</html>

は

<html>
<head>
<title>空の form の例</title>
</head><body><form></form>
<h1>空の <code lang="en">form</code> の例</h1>
</body>
</html>

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

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

HTML として構文解析した文書でも、後から DOM により head 内に form を入れることはできます。

レンダリング

[57] head 内の非空 form

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

安全性

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

例

[27] 単純なフォームの例 HTML 4 27.3、改

 <FORM action="http://somesite.example/prog/adduser" method="post">
 ...form contents...
 </FORM>

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

実装

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

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

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

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

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

不思議解釈

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

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

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

メモ

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

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

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

歴史

フォームの誕生

フォーム

HTML5

[13] [] (0) WF2: <form> element summary., Hixie, 2008-09-03 10:58:26 +09:00, 2024-09-04T12:52:33.000Z https://github.com/whatwg/html/commit/f3fd8d27785712f8bf62ec9a0bbb95111df59c5e

[15]

HTML要素概説

要素名

form

日付

2008-09-03

説明

2008-09-03、 HTML5 に form が追加された。

出典

HTML5 r2142, Hixie, 2008-09-03 10:58:26 +09:00, 2024-09-04T12:52:33.000Z https://github.com/whatwg/html/commit/f3fd8d27785712f8bf62ec9a0bbb95111df59c5e

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

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

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

[65] Web Forms 2.0 (2009-01-05 20:07:15 +09:00 版) http://www.whatwg.org/specs/web-forms/current-work/#form0

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

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

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

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

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

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

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

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

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

[75] ふつうのformをつかいたい - はまちや2 - ニコニコ超会議2012 ( (2012-05-01 14:01:22 +09:00 版)) http://hamachiya.com/form/#slide1

[76] [whatwg] Localisation of form fields ( (2012-05-05 09:15:30 +09:00 版)) http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2012-May/035674.html

[77] Firefox 14 for developers - MDN ( (2012-06-27 06:02:50 +09:00 版)) https://developer.mozilla.org/en/Firefox_14_for_developers#HTML

[78] サーバーにパスワードを送らないフォームを作る - 金利0無利息キャッシング – キャッシングできます - subtech ( (2012-07-04 01:35:05 +09:00 版)) http://subtech.g.hatena.ne.jp/mala/20120703/1341322969

[79] Web Applications 1.0 r7305 forgot to fix the index (again) when removing form= from <progress> and <meter>.]] ( (2012-09-01 08:50:00 +09:00 版)) http://html5.org/tools/web-apps-tracker?from=7304&to=7305

[80] [whatwg] Forms-related feedback ( (2013-01-08 01:23:47 +09:00 版)) http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2013-January/038532.html

[81] HTML Form HTTP Extensions ( (2013-02-21 19:26:21 +09:00 版)) http://cameronjones.github.com/form-http-extensions/index.html

[82] Web Applications 1.0 r7722 Try to define order for supported property names. This is not based on testing. If there are compatibility constraints here that prevent implementing this as specced, please let me know. ( (2013-02-13 09:03:00 +09:00 版)) http://html5.org/tools/web-apps-tracker?from=7721&to=7722

[83] Web Applications 1.0 r7986 Be even more explicit about the supported property names of a <form>. ( (2013-06-19 07:15:00 +09:00 版)) http://html5.org/tools/web-apps-tracker?from=7985&to=7986

[84] Web Applications 1.0 r8041 Don't make form names enumerable. ( (2013-07-10 05:39:00 +09:00 版)) http://html5.org/tools/web-apps-tracker?from=8040&to=8041

[85] Web Applications 1.0 r8185 Make the <form> past names map associations go away when the form owner changes, not when the element is removed from the document. ( (2013-09-14 08:18:00 +09:00 版)) http://html5.org/tools/web-apps-tracker?from=8184&to=8185

[86] [whatwg] Elements should be removed from the past names map once it's no longer associated with the form element ( (2013-09-26 22:45:44 +09:00 版)) http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2013-September/040898.html

[87] [whatwg] Form-associated elements and the parser ( (2013-12-05 18:08:31 +09:00 版)) http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2013-December/041706.html

[88] WWW-Talk Apr-Jun 1994: NCSA Mosaic for X 2.3 available. ( (2014-04-07 05:24:12 +09:00 版)) http://1997.webhistory.org/www.lists/www-talk.1994q2/0134.html

[89] ncsa-mosaic/CHANGES at master · alandipert/ncsa-mosaic ( (2014-04-07 05:29:52 +09:00 版)) https://github.com/alandipert/ncsa-mosaic/blob/master/CHANGES#L227

[90] W3C HTML Form HTTP Extensions ( (2014-05-27 23:38:30 +09:00 版)) http://www.w3.org/TR/2014/WD-form-http-extensions-20140529/

[91] Bug 26521 – [[GetOwnProperty]] behavior for named properties is not web-compatible ( (2014-08-06 04:03:40 +09:00 版)) https://www.w3.org/Bugs/Public/show_bug.cgi?id=26521

[92] Web Applications 1.0 r8843 Update the way some of the selectors are written to use more modern selector features. ( (2014-10-29 03:39:00 +09:00 版)) https://html5.org/r/8843

[93] draft-pfeiffer-remoteaccess-00 - Remote Access to Embedded Devices ( (2014-10-16 23:47:59 +09:00 版)) https://tools.ietf.org/html/draft-pfeiffer-remoteaccess-00#section-2.1

[1] Fix #703: Make form.imageName return non-descendant <img> · whatwg/html@40fa464 (2016-03-03 21:17:34 +09:00 版) https://github.com/whatwg/html/commit/40fa4643dbf0ba004a938444fd4a370a1d3a53e2

[4] Issue 106: The <form> element should only map to FORM landmark with r… (jongund著, 2017-10-10 15:38:56 +09:00) https://github.com/w3c/html-aam/commit/bd7cfedfae9f53c0954c45273af33798d1e5ca75

[5] Issue 106: The <form> element should only map to FORM landmark with restriction of accessible name by jongund · Pull Request #107 · w3c/html-aam (2017-10-11 10:28:44 +09:00) https://github.com/w3c/html-aam/pull/107

[6] The <form> element should only map to FORM landmark with restriction of accessible name · Issue #106 · w3c/html-aam (2017-10-11 10:29:37 +09:00) https://github.com/w3c/html-aam/issues/106

[7] added mapping for form with acc name (stevefaulkner著, 2017-11-23 20:10:21 +09:00) https://github.com/w3c/html-aam/commit/2724b297db1f0bc129bc4fdf711e6c48cf9ac1e4

[8] The <form> element should only map to FORM landmark with restriction of accessible name · Issue #106 · w3c/html-aam (2017-11-24 13:59:24 +09:00) https://github.com/w3c/html-aam/issues/106

[9] Add the autocapitalize attribute (rlanday著, 2017-12-16 08:17:00 +09:00) https://github.com/whatwg/html/commit/f1f0af83e320f14a59dc4e552ee82aab7908f00c

[10] Restrict the main element to be used once per document (annevk著, 2018-01-23 17:10:16 +09:00) https://github.com/whatwg/html/commit/1dec930b3df93c799d5f3f685a46940913476086

属性

内容