form 要素

4.10.3 form 要素

カテゴリー:
フロー・コンテント
パルパブル・コンテント
この要素を使うことができるコンテキスト:
フロー・コンテントが期待される場所
コンテントモデル:
フロー・コンテント。ただし、子孫に form 要素を入れることはできません。
コンテント属性:
グローバル属性
accept-charset - フォームのサブミットに使う文字エンコーディング
action -フォームのサブミットに使う URL
autocomplete - このフォームのコントロールに対するオートフィル機能のためのデフォルト設定
enctype - フォームのサブミットに使うフォームデータセットのエンコーディングタイプ
method - フォームのサブミットに使う HTTP メソッド
name - document.forms API で使うフォームの名前
novalidate - フォームのサブミットのフォームコントロールのバリデーションをバイパスする
target - フォームのサブミットブラウジングコンテキスト
text/html におけるタグの省略:
どちらのタグも省略できません。
指定可能な ARIA role 属性 の値:
あらゆるロールの値
指定可能な ARIA ステートとプロパティ属性:
グローバル aria-* 属性
許可ロールに該当する aria-* 属性
DOM インタフェース:
[OverrideBuiltins]
interface HTMLFormElement : HTMLElement {
           attribute DOMString acceptCharset;
           attribute DOMString action;
           attribute DOMString autocomplete;
           attribute DOMString enctype;
           attribute DOMString encoding;
           attribute DOMString method;
           attribute DOMString name;
           attribute boolean noValidate;
           attribute DOMString target;

  readonly attribute HTMLFormControlsCollection elements;
  readonly attribute long length;
  getter Element (unsigned long index);
  getter (RadioNodeList or Element) (DOMString name);

  void submit();
  void reset();
  boolean checkValidity();
};

form 要素は、フォーム関連要素のコレクションを表します。これらのいくつかは、処理のためにサーバーにサブミットすることができる編集可能な値を表すことができます。

accept-charset 属性には、サブミットに使われるべき文字エンコーディングを指定します。指定されれば、この値は、ユニークなスペース区切りトークンの順序セットでなければいけません。大文字と小文字は区別されません。それぞれのトークンは、ASCII 互換文字エンコーディングラベルの一つに一致しなければいけません。大文字と小文字は区別されません[ENCODING]

name 属性は、forms コレクションの中にある form の名前を表します。この値は空文字であってはならず、それが属する forms コレクションに form 要素があれば、その中でユニークでなければいけません。

autocomplete 属性は列挙属性です。この属性は 2 つの状態を持ちます。on キーワード は、on 状態に相当し、off キーワードは、off 状態に相当します。この属性を省略することも可能です。指定がない場合のデフォルトon 状態です。off 状態とは、デフォルトで、フォーム内のフォームコントロールのオートフィルフィールド名が "off" にセットされることを表します。on 状態とは、デフォルトで、フォーム内のフォームコントロールのオートフィルフィールド名がが "on" にセットされることを表します。

action, enctype, method, novalidate, target 属性は、フォームサブミット用の属性です。

form . elements

該当のフォームにあるフォームコントロールの HTMLCollection を返します(歴史的理由からイメージボタンを除きます)。

form . length

該当のフォームにあるフォームコントロールの数を返します(歴史的理由からイメージボタンを除きます)。

form[index]

該当のフォームの中にある要素のうち、index 番目の要素を返します(歴史的理由からイメージボタンを除きます)。

form[name]

フォームの中から、指定の ID または name を持つフォームコントロール(または、いくつか存在すれば、フォームコントロールの RadioNodeList)を返します。(歴史的理由からイメージボタンを除きます)。もしひとつもなければ、指定の ID を持つ img 要素を返します。

一度、特定の名前を使って要素が参照されたら、たとえその要素の実際の ID または name 属性の値が変更されたとしても、Document にその要素が存在し続ける限り、このメソッドから、その名前を使って、該当の要素を参照できます。

もし、いくつもの項目が一致してしまったら、該当の要素すべてを格納した RadioNodeList オブジェクトが返されます。

form . submit()

該当のフォームをサブミットします。

form . reset()

該当のフォームをリセットします。

form . checkValidity()

フォームのコントロールがすべて妥当なら、true を返します。そうでなければ false を返します。

autocomplete IDL 属性は、同じ名前のコンテント属性を反映しなければいけません。ただし、既知の値に限定されます。

name IDL 属性は、同じ名前のコンテント属性を反映しなければいけません。

acceptCharset IDL 属性は、accept-charset コンテント属性を反映しなければいけません。


elements IDL 属性は、form 要素が Document の中にあれば、その Document ノードをルートとした HTMLFormControlsCollection を返さなければいけません。なければ、form 要素自身をルートとします。そのフィルターは、フォームオーナーがその form 要素となるリスト対象要素に一致します。ただし、type 属性が Image Button 状態にある input 要素は除きます。これは、歴史的な理由によるもので、この特定のコレクションから除外されなければいけません。

length IDL 属性は、elements コレクションによって表されるノードの数を返さなければいけません。

添え字付きプロパティのインデックスは、常に、elements 属性によって返されるオブジェクトによってその時点で添えられるインデックスとなります。

form 要素が インデックス化プロパティ取得のためにインデックス化されるとき、ユーザーエージェントは、その elements コレクションの item メソッドを、引数にインデックスを指定して呼び出したときに返される値を返さなければいけません。


それぞれの form 要素は、名前を要素に結びづけるマッピングを持ちます。それを past names map といいます。それは、名前が変更されたときですら、コントロールの永続的な名前として使われます。

添え字プロパティ名は、次のアルゴリズムから得られた名前から構成されます。順番は、このアルゴリズムから得られた順番です:

  1. Let sourced names be an initially empty ordered list of tuples consisting of a string, an element, a source, where the source is either id, name, or past, and, if the source is past, an age.

  2. For each listed element candidate whose form owner is the form element, with the exception of any input elements whose type attribute is in the Image Button state, run these substeps:

    1. If candidate has an id attribute, add an entry to sourced names with that id attribute's value as the string, candidate as the element, and id as the source.

    2. If candidate has a name attribute, add an entry to sourced names with that name attribute's value as the string, candidate as the element, and name as the source.

  3. For each img element candidate whose form owner is the form element, run these substeps:

    1. If candidate has an id attribute, add an entry to sourced names with that id attribute's value as the string, candidate as the element, and id as the source.

    2. If candidate has a name attribute, add an entry to sourced names with that name attribute's value as the string, candidate as the element, and name as the source.

  4. For each entry past entry in the past names map add an entry to sourced names with the past entry's name as the string, past entry's element as the element, past as the source, and the length of time past entry has been in the past names map as the age.

  5. Sort sourced names by tree order of the element entry of each tuple, sorting entries with the same element by putting entries whose source is id first, then entries whose source is name, and finally entries whose source is past, and sorting entries with the same element and source by their age, oldest first.

  6. Remove any entries in sourced names that have the empty string as their name.

  7. Remove any entries in sourced names that have the same name as an earlier entry in the map.

  8. Return the list of names from sourced names, maintaining their relative order.

The properties exposed in this way must not be enumerable.

form 要素が名前付きプロパティ取得のためにインデックス化される とき、ユーザーエージェントは、次の手順を実行しなければいけません:

  1. candidates を、ライブRadioNodeList オブジェクトとします。これは、フォームオーナーが 、id 属性または name 属性のどちらかが name に等しい form 要素となる、すべてのリスト対象要素を含むものとします。ただし、type 属性が Image Button 状態にある input 要素は除きます。順番はツリー順です。

  2. candidates が空なら、candidatesライブRadioNodeList オブジェクトとします。これは、form 要素の子孫であり、かつ、id 属性または name 属性が name と等しいすべての img 要素を含むものとします。順番はツリー順です。

  3. candidates が空なら、name は、form 要素の past names map にあるエントリーのひとつの名前となります。そのマップにある name と関連づけられたオブジェクトを返します。

  4. candidates が 1 つ以上のノードを含んでいれば、candidates を返し、これらの手順を中止します。

  5. そうでなければ、candidates は正確に 1 つのノードを含んでいます。name から、form 要素の past names map にある candidates にあるノードへのマッピングを追加します。前のエントリーがあれば、それを同じ名前で置き換えます。

  6. candidates の中のノードを返します。

form 要素の past names map に列挙された要素がフォームオーナーを変更したら、そのエントリーはマップから削除されなければいけません。


submit() メソッドは、呼び出されたら、form 要素自身からその form 要素自身をサブミットしなければいけません。その際には、submit() メソッドからサブミットされた ことを表すフラグをセットします。

reset() メソッドは、呼び出されたら、次の手順を実行しなければいけません:

  1. form 要素がリセットのためにロックされているとして記録されているなら、これらの手順を中止します。

  2. form 要素を、リセットのためにロックされたと記録します。

  3. form 要素をリセットします。

  4. form 要素がリセットのためにロックされているとして記録されているのを解除します。

checkValidity() メソッドが呼び出されたら、ユーザーエージェントは、その form 要素の制約を静的にバリデーションします。そして、その制約バリデーションの結果が positive なら true を、negative なら false を返します。

この例は、2 つの検索フォームを示しています:

<form action="http://www.google.com/search" method="get">
 <label>Google: <input type="search" name="q"></label> <input type="submit" value="Search...">
</form>
<form action="http://www.bing.com/search" method="get">
 <label>Bing: <input type="search" name="q"></label> <input type="submit" value="Search...">
</form>

※ 原文:http://www.w3.org/TR/2014/REC-html5-20141028/forms.html#the-form-element