表單是實(shí)現(xiàn)動(dòng)態(tài)網(wǎng)頁(yè)的一種主要的外在形式。

表單和表單網(wǎng)域並不具有排版的能力，表單網(wǎng)頁(yè)的製作最終還是要由表格組織起來(lái)。

html表單是html頁(yè)面與瀏覽器端實(shí)作互動(dòng)的重要手段。利用表單可以收集客戶端提交的有關(guān)資訊。?

在瀏覽網(wǎng)站時(shí)經(jīng)常會(huì)遇到表單，它是網(wǎng)站實(shí)現(xiàn)互動(dòng)功能的重要組成部分。無(wú)論網(wǎng)站使用的是那種形式的語(yǔ)言來(lái)實(shí)現(xiàn)網(wǎng)站的互動(dòng)功能，例如ASP、PHP、JSP，表單已經(jīng)成為它們統(tǒng)一的外在形式。?

HTML表單(Form)是HTML的一個(gè)重要部分，主要功能是收集訊息，具體來(lái)說(shuō)是收集瀏覽者的信息。

?

學(xué)習(xí)HTML表單(Form)最關(guān)鍵要掌握的有三個(gè)重點(diǎn)：

·???????? 表單控制項(xiàng)(Form Controls)

·???????? Action

·???????? Method

先說(shuō)表單控制項(xiàng)(Form Controls)，透過(guò)HTML表單的各種控制，使用者可以輸入文字控制項(xiàng)，或從中選擇，以及做選項(xiàng)的操作。例如上面的例句裡，input type= "text"就是一個(gè)表單控件，表示一個(gè)單行輸入框。

使用者填入表單的資訊總是需要程式來(lái)處理，表單裡的action就指明了處理表單資訊的檔案。至於method，表示了發(fā)送表單資訊的方式。 method有兩個(gè)值：get和post。 get的方式是將表單控制項(xiàng)的name/value資訊經(jīng)過(guò)編碼之後，透過(guò)URL發(fā)送(你可以在網(wǎng)址列看到)。而post則將表單的內(nèi)容透過(guò)http發(fā)送，你在網(wǎng)址列看不到表單的提交資訊。那什麼時(shí)候用get，什麼時(shí)候用post呢？一般是這樣來(lái)判斷的，如??果只是為取得和顯示數(shù)據(jù)，用get；一旦涉及數(shù)據(jù)的保存和更新，那麼建議用post。

?HTML表單(Form)常用控制項(xiàng)(Controls)

#HTML表單(Form)常用控制項(xiàng)有：

#表單控制項(xiàng)(Form Contros) ? ? ? ? ??說(shuō)明

? ??input ? type="text" ? ? ?#??##input ? type="submit" ? ? ? ? ?將表單(Form)裡的資訊提交給表單裡action所指的文件

? ??input? type="checkbox" type="check ##複選框

? ??input ? type="radio" ? ? ? ? ? ??單一選方

? ?? #lect???下拉方塊

textArea ? ? ? ? ? ? ? ? ? ? ? ? ? ? ??? ##?文字用*表示)

表單控制項(xiàng)(Form Control)：?jiǎn)涡形淖州斎敕綁K(input type="text")

<input type="text" name="yourname">

表單控制項(xiàng)(Form Control )：複選框(input type="checkbox")

複選框允許使用者在一組選項(xiàng)裡，選擇多個(gè)。範(fàn)例程式碼：

<input type="checkbox" name="fruit" value ="orange">桔子<br><input type="checkbox" name="fruit" value ="mango">芒果<br>

用checked表示缺省已選的選項(xiàng)。

<input type="checkbox" name="fruit" value ="orange" checked>桔子<br>

#表單控制項(xiàng)(Form Control)：?jiǎn)芜x框(input type="radio")

使用單選框，讓使用者在一組選項(xiàng)裡只能選擇一個(gè)。範(fàn)例程式碼：

<input type="radio" name="fruit" value = "Orange">桔子<br><input type="radio" name="fruit" value = "Mango">芒果<br>

以checked表示缺省已選的選項(xiàng)。

<input type="radio" name="fruit" value = "Orange" checked>桔子<br>

#表單控制項(xiàng)(Form Control)：下拉方塊(select)

下拉方塊(Select)可以用做單選，也可以用做複選。單選例句如下：

<select name="fruit" >
? <option value="apple">蘋果
? <option value="orange">桔子
? <option value=" mango">芒果
</select>

如果要變成複選，加muiltiple即可。使用者用Ctrl來(lái)實(shí)現(xiàn)多選。例句：

<select name="fruit" multiple>

使用者也可以用size屬性來(lái)改變下拉方塊(Select)的大小。

表單控制項(xiàng)(Form Control)：多行輸入框(textarea)

多行輸入框(textarea )主要用於輸入較長(zhǎng)的文字資訊。例句如下：

<textarea name="yoursuggest" cols ="50" rows = "3"></textarea>

其中cols表示textarea的寬度， rows表示textarea的高度。

表單控制項(xiàng)(Form Control)：密碼輸入框(input type="password")

密碼輸入框(input type="password")主要用於一些保密資訊的輸入，例如密碼。因?yàn)槭褂谜咻斎氲臅r(shí)候，顯示的不是輸入的內(nèi)容，而是黑點(diǎn)符號(hào)。 。例句如下：

<input type="password" name="yourpw">

表單控制項(xiàng)(Form Control )：提交(input type="submit")

透過(guò)提交(input type=submit)可以將表單(Form)裡的資訊提交給表單裡action指向的檔案。例句如下：

<input type="submit" value="提交">

頁(yè)面中的form提交到哪個(gè)頁(yè)面是由action屬性進(jìn)行設(shè)定的。

然後點(diǎn)擊<input type="submit">類型的按鈕傳遞到對(duì)應(yīng)的頁(yè)面

也可以透過(guò)<input type="button">類型的按鈕新增onClick事件透過(guò)js程式碼來(lái)重置form表單的action屬性值來(lái)轉(zhuǎn)到不同的頁(yè)面。