フォームが容器を構成要素として作らユーザーツールを使用してウェブページの相互作用であり、パッケージの他の任意の数のコントロールを形成し、ならびに任意の他の<body>ラベル内の要素が利用可能です
形態は含めることができ<input>、<menus>、<textarea>、<fieldset>、<legend>、<label>および他の形態の制御要素
注：フォームは、ネストされた形で許可されていません
フォーム要素
フォーム要素を受け入れる、文字セット、アクション、オートコンプリート、ENCTYPE、方法、名前、NOVALIDATE、ターゲットアクションが必要とされる8は、属性と属性項目名を持ちます
フォーム名
name属性は、フォームの名前を指定し、名前=「テスト」場合、フォームのdocument.forms.testを取得するにはJavascriptを使用することができます
<form method="get" action="form.php" name="test"></form>
<script>
var oForm = document.forms.test;
console.log(oForm.method);//get
</script>
专门建立的学习Q-q-u-n： 731771211，分享学习方法和需要注意的小细节，不停更新最新的教程和学习技巧
（从零基础开始到前端项目实战教程，学习工具，全栈开发学习路线以及规划）
文字セット
受け入れ-charset属性は、文字セットのスペース区切りのリストで、サーバーは、フォームに受け入れられた文字セットを処理するデータを提供します。受け入れ-charset属性は、あなたは、文字の範囲を指定することができますサーバーは、これらの文字セットをサポートしている必要があり、したがって、正しく形式のデータを解釈することができます。この属性の値は、名前のリストが含まれている引用符で囲まれた文字セットです。ユーザーが使用する文字許容文字セットは、すなわち、それは一致しない場合は、ブラウザは異なる扱いフォームまたはフォームを無視することもできます。このプロパティのデフォルト値は「不明」で、文字セットと同じ形式を含むドキュメントの文字集合の形を表しています。HTMLの以前のバージョンでは、異なる文字エンコーディングは、スペースまたはカンマで区切ってもよいです。HTML5では、空間のみを区切り記号として許可することができます
提出されたアドレス
action属性は、どこフォームデータを送信するには、フォームが送信された指定した場合、この属性を無視した場合、フォームがありますURL形式にリダイレクトされます。この値は、することができ<button>たり<input>formaction属性の過負荷要素（カバー）
オープン
アクションのURLを表示するターゲット属性を指定します。5 *空白の値は、*自己、*親、*トップ、framename。
データ符号化
フォームデータをエンコードする方法をサーバーに送信される前に、enctype属性を指定します。このプロパティは、ほとんどの場合、設定を必要としません。この値は可能<button>か<input>formenctype属性の過負荷要素（カバー）。method属性がポストされたとき、のenctypeフォームは、コンテンツサーバーのMIMEタイプに提出されます。可能な値は以下のとおりです。
すべての文字（デフォルト）を送信する前に、アプリケーション/ x-www-form-urlencodedでエンコード
マルチパート/フォームデータの文字エンコーディングを行います。フォームを使用して、ファイルアップロードコントロールが含まれている場合、あなたはその値を使用する必要があります
text / plainのスペースは「+」プラスではなく、特殊な文字エンコーディングに変換しました
データ送信
フォームデータは、2つの方法（方法）で送信することができる：デフォルトでGETおよびPOST、GETメソッド。この属性値は、過負荷又はformmethod要素（カバー）することができます
POSTメソッド
POSTメソッド場合、ブラウザは、以下の2つのステップでデータを送信します。接続が確立されると、まず、接触を確立するために指定されたアクション属性フォーム処理サーバとブラウザ、ブラウザがサーバへ送信されたデータセグメントを送信する方法に従って
サーバー側では、POSTスタイルのアプリケーションが実行を開始したら、これらの形のリードパラメータ値を適用する前に使用することができたら、パラメータは、フラグから読まれるべきで、これらのパラメータをデコードする必要があります。どのようにユーザー固有のサーバー・アプリケーションは、明示的にこれらのパラメータを受け入れる必要があります
[シナリオ]
1、GETメソッドと比較してPOSTメソッドの観点から大規模なデータ処理は、複数のフィールドを処理します
2、データセキュリティ、GETメソッドは、ネットワーク詮索は簡単にそれらをキャッチすることができますので、あなたはまた、ログファイルサーバから抽出することができ、アプリケーション内で直接URLパラメータを形成するため、およびPOSTメソッドは、この領域ではありません抜け穴
GETメソッド
GETメソッドは、ブラウザがサーバの処理フォームとの接続を確立した場合、すべてのデータを送信する直接送信ステップを形成する：ブラウザがデータに直接取り付けられたフォームアクションURLを送信した後。両者の間に疑問符で区切られています。
[シナリオ]
1、唯一のいくつかの簡単な送信GETフィールドので、最高の伝送性能を形成
図2に示すように、処理方法を符号化及び復号化することなく、なぜならGETメソッドプロセス、単純です
図3に示すように、処理パラメータパッシング、方法は、URLの一部として含まGETパラメータフォームを可能にするので
<h3>get方法</h3>
<form method="get" action="form.php" target = "_blank">
<p><label>x:<input name="x"></label></p>
<p><label>y:<input name="y"></label></p>
<p><button type="submit">Submit</button></p>
</form>
<a title="form.php?x=28&y=66" href="form.php?x=28&y=66">a标签传参</a>
<h3>post方法</h3>
<form method="post" action="form.php" target = "_blank">
<p><label>x:<input name="x"></label></p>
<p><label>y:<input name="y"></label></p>
<p><button type="submit">Submit</button></p>
</form>
//GET方法的URL显示为： http://127.0.0.1/form.php?x=1&y=2
//POST方法的URL显示为：http://127.0.0.1/form.php
<p>
<?php
if(isset($_REQUEST["x"]) && isset($_REQUEST["y"])){
echo "x: " .$_REQUEST["x"] ."<br>";
echo "y: " .$_REQUEST["y"];
}
?>
</p>
オートコンプリート
オートコンプリートHTML5は、所定のフォームが自動補完を有効にする必要があるかどうか、新しいプロパティです。ユーザーがフィールドに入力を開始すると、ブラウザベースの値の前に入力されたが、それはフィールドのオプションを埋めるために示すべきです
注：有効なIEブラウザがプロパティをサポートしていません、唯一の要素は、name属性を持っています、
<form autocomplete="on | off"> //该属性默认为on，当设置为off时，规定禁用自动完成功能</pre>
<pre style="-webkit-tap-highlight-color: transparent; font-family: Courier, "Courier New", monospace; display: block; padding: 1em; border: 2px solid rgb(221, 221, 221); border-radius: 4px; overflow-x: auto; line-height: 1.6; background: rgb(248, 248, 248);"><button id="btn1">打开自动完成</button>
<button id="btn2">关闭自动完成</button>
<form method="get" action="#" name="test">
<p><label>x:<input name="x"></label></p>
<p><label>y:<input name="y"></label></p>
<p><button type="submit">Submit</button></p>
</form>
<script>
var oForm = document.forms.test;
btn1.onclick = function(){
oForm.autocomplete = 'on';
};
btn2.onclick = function(){
oForm.autocomplete = 'off';
};
</script>
专门建立的学习Q-q-u-n： 731771211，分享学习方法和需要注意的小细节，不停更新最新的教程和学习技巧
（从零基础开始到前端项目实战教程，学习工具，全栈开发学习路线以及规划）
フォームのバリデーション
NOVALIDATE HTML5はフォームが送信されるときに検証されてはならない、新しいプロパティです
注：IE9-はサポートされていません
<button id="btn1">打开验证</button>
<button id="btn2">关闭验证</button>
<form method="get" action="#" name="test">
E-mail: <input type="email" name="user_email" />
<input type="submit" />
</form>
<script>
var oForm = document.forms.test;
btn1.onclick = function(){
oForm.removeAttribute('novalidate');
};
btn2.onclick = function(){
oForm.setAttribute('novalidate','');
};
</script>
