Form表單主要是允許用戶在表單中輸入信息臂聋，并最終將這些信息提交服務(wù)器的一個(gè)元素光稼，重在收集信息方面。由于用戶各種各樣的信息孩等，所以form可以嵌入的元素就有許多種艾君， 與Form常搭配的有input、Select肄方、TextArea元素等冰垄。
Form元素用于生成輸入表單，但自己不會(huì)生成可視化部分权她，在使用Form時(shí)必須制定action虹茶、method和name屬性逝薪。action指定提交服務(wù)器的Url； method指定提交服務(wù)器的方法（get或post）蝴罪；name指定表單的唯一名稱董济，作為參數(shù)一起提交到服務(wù)器。
- Input元素洲炊， input元素是表單控件元素中功能最豐富的感局，只需要設(shè)置不同的type就可以實(shí)現(xiàn)不同的功能。
<body>
<!-- action指定表單被提交到的那個(gè)服務(wù)器地址 method 指定提交的方式-->
<!-- action 和 method為必填項(xiàng) 類似于iOS中AFN請(qǐng)求時(shí) path和請(qǐng)求方法-->
<!-- 表單的enctype屬性用于指定表單數(shù)據(jù)的編碼方式-->
<!-- 在form里面定義一個(gè)或多個(gè)表單控件時(shí),一旦提交該表單,該表單里的表單控件將會(huì)轉(zhuǎn)換成請(qǐng)求參數(shù)暂衡。 每個(gè)name屬性的表單控件對(duì)應(yīng)一
個(gè)請(qǐng)求參數(shù),沒有name 屬性的表單控件不會(huì)生成請(qǐng)求參數(shù)-->
<form action="http://www.crazyit.org" method="get">
<!-- input 元素是表單控件元素中功能最豐富的,只需要設(shè)置下type就可以展示各種不同的外觀-->
單行文本框:<input id="username" name="username" type="text" /><br />
不能編輯的文本框:<input id="username2" name="username" type="text" readonly="readonly" /><br />
密碼框:<input id="password" name="password" type="password" /><br/>
隱藏域: <input id="hidden" name="hidden" type="hidden" /><br />
第一組單選框:<br />
<!-- 單選框 每次只能有一個(gè)被選中 -->
<input id="color" name="color" type="radio" value="red">
<input id="color2" name="color" type="radio" value="green">
<input id="color3" name="color" type="radio" value="blue">
<br/>
第二組單選框:<br/>
<input id="gender" name="gender" type="radio" value="male">
<input id="gender2" name="gender" type="radio" value="female">
<br/>
兩個(gè)復(fù)選框:<br/>
<!-- 復(fù)選框可以多選 -->
<!-- 選中時(shí) 才會(huì)上傳值-->
<input id="website" name="website" type="checkbox" value="leegang.org">
<input id="website2" name="website" type="checkbox" value="crazyit.org">
<br/>
<!-- 文件選擇非常簡(jiǎn)單 -->
文件上傳域:<input id="file" name="file" type="file">
<br/>
圖像域:<input type="image" src="AVPlayer.png" width="100" height="100" >
<br/>
下面四個(gè)是按鈕:<br/>
<input id="ok" name="ok" type="submit" value="提交">
<input id="dis" name="dis" type="submit" value="重填">
<input id="cancel" name="cancel" type="reset" value="重填">
<input id="no" name="no" type="button" value="無動(dòng)作">
</form>
</body>
運(yùn)行效果圖如下询微，可以看到Input元素非常豐富，只需要設(shè)置不同的type就能試下不同外觀的控件狂巢。
Form--Input.png
- Select元素撑毛，實(shí)現(xiàn)下拉菜單和列表框
<body>
<form action="http://crazyit.org" method="get">
下面是簡(jiǎn)單下拉菜單<br/>
<!-- 單選框只會(huì)顯示一行出來 -->
<select id="skills" name="skills">
<option value="java">Java語言</option>
<option value="C">c語言</option>
<option value="ruby">ruby語言</option>
</select>
<br/>
<br/>
下面是多選的列表框<br/>
<!-- 多選框 會(huì)全部展示出來 -->
<select id="books" name="books" multiple="multiple" size="3">
<option value="java">Java語言</option>
<option value="C">c語言</option>
<option value="ruby">ruby語言</option>
</select>
<br/>
下面是允許多選的列表框
<select id="leegang" name="leegang" multiple="multiple" size="6">
<!-- optgroup 是分組 但所有的groupt都還是一個(gè)整體。 -->
<optgroup label="瘋狂Java體系圖書">
<option value="java" label="aaaaa">瘋狂Java講義</option>
<option value="Android" >瘋狂Android講義</option>
<option value="ee" >輕量java ee企業(yè)應(yīng)用實(shí)戰(zhàn)</option>
</optgroup>
<optgroup label="其他圖書">
<option value="Struts">Struts 2.1權(quán)威指南</option>
<option value="ror" >ROR敏捷開發(fā)最佳實(shí)踐</option>
</optgroup>
</select>
<br/>
<button type="submit">提交</button>
</form>
</body>
顯示效果, 可以看到Select默認(rèn)是下拉單選菜單唧领，設(shè)置multiple屬性后藻雌，就會(huì)將選擇全部展示出來。
Form--Select.png
- Textarea元素斩个，用于生成多行文本域胯杭，方便用戶輸入，類似于iOS中的UITextView受啥。
<body>
<!--textArea用于生成多行文本域 -->
<form action="http://www.crazyit.org" method="post">
簡(jiǎn)單多行文本域:<br/>
<textarea cols="10" rows="2"></textarea>
<br/>
只讀多行文本域:<br/>
<textarea cols="28" rows="4" readonly="readonly">
瘋狂Java講義
輕量級(jí)Java EE企業(yè)應(yīng)用實(shí)戰(zhàn)
</textarea>
<br/>
<button type="submit"><b>提交</b></button>
</form>
</body>
效果圖：
Form--TextArea.png
