HTML 表单
HTML ;表单包含表单元素。
; ;<span ;style="color: ;#ff0000;"><form></span> ;元素定义 ;HTML ;表单
表单元素指的是不同类型的 ;input ;元素、复选框、单选按钮、提交按钮等等。
HTML ;表单用于搜集不同类型的用户输入。
; ;<pre><form>
;.
form ;elements
;.
</form></pre> ; ;<div><span ;style="color: ;#000000;"> <input> </span>元素是最重要的表单元素。
<input> ;元素有很多形态，根据不同的 type 属性。
这是本章中使用的类型：（另外还有password，checkbox，button等）
; ;<table ;class="dataintable"> ; ;<tbody> ; ;<tr><th>类型</th><th>描述</th></tr> ; ;<tr> ; ;<td>text</td> ; ;<td>定义常规文本输入。</td> ; ;</tr> ; ;<tr> ; ;<td>radio</td> ; ;<td>定义单选按钮输入（选择多个选择之一）</td> ; ;</tr> ; ;<tr> ; ;<td>submit</td> ; ;<td>定义提交按钮（提交表单）</td> ; ;</tr> ; ;</tbody> ; ;</table> ; ;
HTML5 ;输入类型
; ;HTML5 ;增加了多个新的输入类型：
; ;
- color
- date
- datetime
- datetime-local
- month
- number
- range
- search
- tel
- time
- url
- week
注释：老式 ;web ;浏览器不支持的输入类型，会被视为输入类型 ;text。
; ;
输入限制
; ;这里列出了一些常用的输入限制（其中一些是 ;HTML5 ;中新增的）：
; ;<table ;class="dataintable"> ; ;<tbody> ; ;<tr><th>属性</th><th>描述</th></tr> ; ;<tr> ; ;<td>disabled</td> ; ;<td>规定输入字段应该被禁用。</td> ; ;</tr> ; ;<tr> ; ;<td>max</td> ; ;<td>规定输入字段的最大值。</td> ; ;</tr> ; ;<tr> ; ;<td>maxlength</td> ; ;<td>规定输入字段的最大字符数。</td> ; ;</tr> ; ;<tr> ; ;<td>min</td> ; ;<td>规定输入字段的最小值。</td> ; ;</tr> ; ;<tr> ; ;<td>pattern</td> ; ;<td>规定通过其检查输入值的正则表达式。</td> ; ;</tr> ; ;<tr> ; ;<td>readonly</td> ; ;<td>规定输入字段为只读（无法修改）。</td> ; ;</tr> ; ;<tr> ; ;<td>required</td> ; ;<td>规定输入字段是必需的（必需填写）。</td> ; ;</tr> ; ;<tr> ; ;<td>size</td> ; ;<td>规定输入字段的宽度（以字符计）。</td> ; ;</tr> ; ;<tr> ; ;<td>step</td> ; ;<td>规定输入字段的合法数字间隔。</td> ; ;</tr> ; ;<tr> ; ;<td>value</td> ; ;<td>规定输入字段的默认值。</td> ; ;</tr> ; ;</tbody> ; ;</table> ; ;
; ;
参考：
; ;- HTML ;输入类型
- HTML ;输入属性
单选按钮输入
; ;<input ;type="radio"> 定义单选按钮。
单选按钮允许用户在有限数量的选项中选择其中之一：
; ;
实例
; ;<pre><form><input ;type="radio" ;name="sex" ;value="male" ;checked>Male
<br>
<input ;type="radio" ;name="sex" ;value="female">Female
</form> ;</pre> ; ; ; ;
提交按钮
; ;<input ;type="submit"> 定义用于向表单处理程序（form-handler）提交表单的按钮。
<span ;style="color: ;#ff0000;">表单处理程序通常是包含用来处理输入数据的脚本的服务器页面。</span>
表单处理程序在表单的 <span ;style="color: ;#ff0000;">action</span> 属性中指定：
; ;
实例
; ;<pre><form ;action="action_page.php">First ;name:<br>
<input ;type="text" ;name="firstname" ;value="Mickey">
<br>
Last ;name:<br>
<input ;type="text" ;name="lastname" ;value="Mouse">
<br><br>
<input ;type="submit" ;value="Submit">
</form> ;</pre> ; ; ; ;
Action ;属性
; ;action ;属性定义在提交表单时执行的动作。
向服务器提交表单的通常做法是使用提交按钮。
通常，表单会被提交到 ;web ;服务器上的网页。
在上面的例子中，指定了某个服务器脚本来处理被提交表单：
; ;<pre><form ;action="action_page.php"></pre> ; ;
<span ;style="font-family: ;verdana, ;Arial, ;Helvetica, ;sans-serif; ;font-size: ;14px; ;line-height: ;1.5; ;color: ;#ff0000;">如果省略 ;action ;属性，则 ;action ;会被设置为当前页面。</span>
; ;
; ;
Method ;属性
; ;method ;属性规定在提交表单时所用的 ;HTTP ;方法（GET 或 POST）
; ;<pre><form ;action="action_page.php" ;method="GET">
或：
<form ;action="action_page.php" ;method="POST"></pre> ; ;<div> ; ;
何时使用 ;GET？
; ;<span ;style="color: ;#ff0000;">您能够使用 ;GET（默认方法）：</span>
如果表单提交是被动的（比如搜索引擎查询），并且没有敏感信息。
当您使用 ;GET ;时，表单数据在页面地址栏中是可见的：
; ;<pre>action_page.php?firstname=Mickey&lastname=Mouse</pre> ; ;
注释：GET ;最适合少量数据的提交。浏览器会设定容量限制。
; ;<div> ; ;
何时使用 ;POST？
; ;您应该使用 ;POST：
<span ;style="color: ;#ff0000;">如果表单正在更新数据，或者包含敏感信息（例如密码）。</span>
POST ;的安全性更加，因为在页面地址栏中被提交的数据是不可见的。
; ; ; ;
Name ;属性
; ;如果要正确地被提交，每个输入字段必须设置一个 ;name ;属性。
本例只会提交 ;"Last ;name" ;输入字段，因为”First ;name”没有设置 ;name ;属性：
; ;
实例
; ;<pre><form ;action="action_page.php">First ;name:<br>
<input ;type="text" ;value="Mickey">
<br>
Last ;name:<br>
<input ;type="text" ;name="lastname" ;value="Mouse">
<br><br>
<input ;type="submit" ;value="Submit">
</form> ;</pre> ; ;
; ;
用 ;<fieldset> ;组合表单数据
; ;<fieldset> 元素组合表单中的相关数据
<legend> 元素为 ;<fieldset> ;元素定义标题。
; ;
实例
; ;<pre><form ;action="action_page.php"><fieldset>
<legend>Personal ;information:</legend>
First ;name:<br>
<input ;type="text" ;name="firstname" ;value="Mickey">
<br>
Last ;name:<br>
<input ;type="text" ;name="lastname" ;value="Mouse">
<br><br>
<input ;type="submit" ;value="Submit"></fieldset>
</form> ;</pre> ; ; ; ;
HTML ;Form ;属性
; ;HTML ;<form> ;元素，已设置所有可能的属性，是这样的：
; ;
实例
; ;<pre><form ;action="action_page.php" ;method="GET" ;target="_blank" ;accept-charset="UTF-8"ectype="application/x-www-form-urlencoded" ;autocomplete="off" ;novalidate>
.
form ;elements
;.
</form> ;</pre> ; ; ; ;<table ;class="dataintable"> ; ;<tbody> ; ;<tr><th>属性</th><th>描述</th></tr> ; ;<tr> ; ;<td>accept-charset</td> ; ;<td>规定在被提交表单中使用的字符集（默认：页面字符集）。</td> ; ;</tr> ; ;<tr> ; ;<td>action</td> ; ;<td>规定向何处提交表单的地址（URL）（提交页面）。</td> ; ;</tr> ; ;<tr> ; ;<td>autocomplete</td> ; ;<td>规定浏览器应该自动完成表单（默认：开启）。</td> ; ;</tr> ; ;<tr> ; ;<td>enctype</td> ; ;<td>规定被提交数据的编码（默认：url-encoded）。</td> ; ;</tr> ; ;<tr> ; ;<td>method</td> ; ;<td>规定在提交表单时所用的 ;HTTP ;方法（默认：GET）。</td> ; ;</tr> ; ;<tr> ; ;<td>name</td> ; ;<td>规定识别表单的名称（对于 ;DOM ;使用：document.forms.name）。</td> ; ;</tr> ; ;<tr> ; ;<td>novalidate</td> ; ;<td>规定浏览器不验证表单。</td> ; ;</tr> ; ;<tr> ; ;<td>target</td> ; ;<td>规定 ;action ;属性中地址的目标（默认：_self）。</td> ; ;</tr> ; ;</tbody> ; ;</table> ; ;