什麼是表單?
HTML中的表單是HTML頁面與瀏覽器端實現交互的重要手段。利用表單，服務器可以收集客戶端瀏覽器提交的相關信息，比如輸入的密碼等等。我們在瀏覽網站時經常會遇到表單，它是服務器與瀏覽器實現互動功能的重要組成部分，互動在這裡的意思是指相互之間交換數據的一個過程，比如把我們在本地輸入的密碼傳送到服務器上。不管網站的服務端使用的是哪一種形式的語言來實現網站的互動的功能，例如ASP、PHP、JSP等，目前表單都已經成為它們統一的信息收集方法。
表單的主要功能是收集信息，具體的說是收集瀏覽者的信息。例如在網上申請一個電子郵箱，就必須按要求填寫完成網站提供的表單頁面，其內容主要是姓名、年齡、聯繫方式等個人信息。又例如要在某個論壇上發言，發言之前要申請資格，也是要填寫完成一個表單網頁。當然表單在不看源代碼的情況下是不可見的，用戶感覺不出表單的存在了。
表單可以通常用於調查、定購、搜索等功能，一般的表單由兩部分組成，一是描述表單元素的HTML源代碼，在瀏覽器上我們可以通過源代碼來查找這部分。二是客戶端腳本，或者是服務器端用來處理用戶所填寫的程序，這裡主要是處理收集過來的數據，比如上面的例子中獲得的密碼，傳送到服務器上肯定要驗證密碼是否正確的了，如果正確就進入，錯誤就登陸不了，這就是一個處理過程。在HTML中，我們可以定義表單，並且使表單與ASP、PHP等服務端腳本語言的表單處理程序配合。表單信息的處理過程為：當我們單擊表單中提交的按鈕時，輸入在表單中的信息就會傳送到服務器中，然後由服務器的相關應用程序進行處理，處理後或者將用戶提交的信息存儲在服務端的數據庫中，或者將有關信息返回到客戶端的瀏覽器上。下面就來具體接觸一下表單的各個知識點。
一、表單標記<Form>
表單是在網頁上的一個特定的區域中，這個區域由一對<FORM>標記定義和標識的。 <FORM>標記在網頁中主要有兩個方面的作用。
第一、可以限定表單它的作用範圍，其他的表單對象標記都要插入到表單之中。比如我們單擊提交按鈕時，提交的也是表單範圍之內的內容，而表單之外的內容確不會提交。
第二、包含表單本身的所具有的相關信息，例如處理表單的腳本程序的位置、提交表單的方法等。表單的基本語法和語法解釋如下。
基本語法：
<FORM name=form_name method=method action=URL enctype=value target=target_win> ..............</FORM>
語法解釋如下表：
屬性 | 描述 |
NAME | 表單的名稱 |
METHOD | 定義表單的從瀏覽器傳送到服務器的方法，一般用：get和post兩種方法 |
ACTION | 定義表單處理程序的位置，有絕對路徑和相對路徑兩種 |
ENCTYPE | 設置表單的編碼方式 |
TARGET | 設置返回信息的顯示方式 |
在上面的屬性中NAME、METHOD、ACTION最為常用，也是腳本程序分析的基礎，下面分別對他們進行詳細的說明和解釋。 1. <FORM>標記的Name屬性基本語法是： <FORM name=form_name> ………………… <FORM> 通過表單名可以控製表單與服務端的處理程序之間建立關係，用名字來確定在服務端中程序處理的標識。
2. <FORM>標記的Action屬性基本語法是： <FORM ACTION=URL> ………………… <FORM> 通過表單的ACTION屬性，定義了表單中數據提交的地址，這個地址可以是絕對路徑也可以是相對路徑，也可以是郵件地址.
例如:<FORM NAME=郵件ACTION=mailto:[email protected]>
3. <FORM>標記的Mthod屬性基本語法是： <FORM Mthod=method> ……………… <FORM> Mthod有兩種方法選擇，一是Get二是Post。通過Get方法提交數據時，那麼表單中所有的內容都會附加在URL地址後面，之間通過問號?隔開。傳遞數據的格式是name=value，name就是要傳遞的數據的名字，而value就是要傳遞的值，當有多個要傳遞的時候，多個值之間可以通過符號&分隔開。例如http://localhost/haha/haha.asp?name1=value1&name2=value2。由於這個數據是在URL地址後面，所以對提交的信息的長度進行了限制，不可以超過8192個字符。目前使用最多的還是Post方法，這個方法將用戶在表單中填寫的數據包含在表單的主體中，一起傳到服務端的處理程序中，所以這個方法沒有大小限制，在不指明哪種方式時，默認是Get方式。 在定義好了表單標記<FORM>後，就可在裡面添加完成具體功能的代碼的標記的了，表單中可以包含的標記有4個，如下表所示
標記 | 描述 |
<INPUT> | 表單輸入標記 |
<SELECT> | 菜單和列表標記 |
<OPTION> | 菜單和列表項目標記 |
<TEXTAREA> | 文字域標記 |
在HTML代碼中，他們的組織形式如下
<FORM> <input>……………</input> <textarea>……………</textarea> <select> <option>…………</option> </select></FORM>
對於上面的標記，在腳本黑客技術中最頻繁的應該就是<INPUT>和<TEXTAREA>這兩個了，下面就詳細的來講解這兩個標記。二、輸入標記<Input>輸入標記<INPUT>是表單中最常用的標記之一，我們在網頁中常用的文本域、按鈕都是使用的這個標記。基本語法如下:
<form> <input name=field_name type=type_name></form>
其中name是域的名稱，type是域的的類型。在type屬性中可以有很多屬性值。其中常用的而且是和黑客技術聯繫緊密的有：TEXT、PASSWORD、FILE、BUTTON、SUBMIT、RESET、HIDDEN。 1.文字域TEXT
TEXT屬性值用來設定在表單的文本區域中，輸入任何類型的文本、數字和字母。其中輸入的數據是以單行顯示。這樣說可能大家很難理解，等下我給大家舉個例子說明，首先看他的基本語法和語法解釋。基本語法：<INPUT type=text name=field_name maxlength=value size=value value=field_VALUE>語法解釋：這些解釋如下表所示
文字域屬性 | 描述 |
NAME | 文字域的名稱 |
MAXLENGTH | 文字域的最大輸入字符數 |
SIZE | 文字域的寬度（以字符為單位） |
VALUE | 文字域的默認值 |
這就是文字域的一些基本知識，可能很多朋友還是不明白，下面就通過編寫一個例子來說明，代碼如下:
<html> <head> <title>插入文字域</title> </head> <body> 用戶調查<form action=mailto:[email protected] method=get name=haha> <!--編寫一個表單，連接為郵件地址，方法是get提交，名字是haha--> 姓名：<input type=text name=username size=20> <!--編寫一個文字域，名字為username，寬度為20--> 網址：<input type=text name=URL size=20 maxlength=50 value=http://> <!--編寫一個文字域，名字為URL，寬度為20，最大輸入長度為50 默認值是http://--> </from> </body></html>
編寫完代碼之後，我們把後綴名改成html後，執行看看，如(圖1)所示，對於這樣的圖片來說，相信會上網的朋友都應該都見過吧。
(圖1)
2. 密碼域Password我們在上網時，比如登陸郵箱是肯定要輸入密碼的，這個輸入密碼的輸入框叫做密碼域，它是文本域的另外一種形式。他的功能是輸入到文本域中的文章均以星號*或者圓點顯示，基本語法和上面的文字域差不多，區別是要把type中的text改成password即可。還是用上面文本域的例子為基礎，在<form>標記之間加入一條代碼密碼：<inpyt type=password name=password size=20 maxlength=30> ，保存之後打開文件，並且在密碼輸入框中輸入任何字符看看，都是圓點，而真正的字符卻隱藏了，如(圖2)所示。
(圖2)
3.文件域File
文件域可以讓我們在域的內部填寫自己本地電腦上的文件，最後通過表單上傳，這是文件域的基本功能。運用的最多的應該就是上傳了。文件域在外觀上是一個文本框加一個瀏覽按鈕，我們既可以直接將要上傳給網站的文件的路徑填寫在文本框中，也可以單擊瀏覽按鈕，在自己的電腦中找到要上傳的文件。
基本語法是
<INPUT type=file name=field_name>它的類型為File，Name為這個文件域的名稱，下面來簡單的編寫一個文件域，代碼如下：
<html> <head> <title>文本域</title> </head> <body> <form> 請上傳你的相片：<INPUT type=file name=file> </form> </body></html>
保存之後打開就可以看到文本域的真實面目了，如(圖3)所示。這樣的上傳圖片相信大家都見過吧。
(圖3)
4.按鈕表單中的按鈕起著一個至關重要的作用。按鈕可以有提交表單所有數據到服務端的功能、可以在用戶需要修改表單的時候，將表單恢復到初始的狀態，還可以依照程序的需要，發揮其他的作用。按鈕一般分了BUTTON(普通按鈕)、SUBMIT(提交按鈕)、RESET(重置按鈕) 三種。 普通按鈕BUTTON的語法是<INPUT type= BUTTON name= field_name value= BUTTON_TEXT>，其中value的值代表顯示在按鈕上的文字。 提交按鈕SUBMIT的作用是在單擊這個按鈕後，把表單中的數據全部提交到服務端的處理程序中去。基本語法是<INPUT type= SUBMIT name= field_name value= BUTTON_TEXT>，其中value的值代表顯示在按鈕上的文字。 重置按鈕RESET就是在單擊按鈕後，把我們添入在表單中的數據全部清除，恢復到默認的表單內容設定。基本語法是<INPUT type= RESET name= field_name value= BUTTON_TEXT>，再次提示：在HTML語言中，大小是不區分的。下面簡單編寫一個例子來實踐一下按鈕的效果，代碼如下。
<html> <head> <title>表單按鈕演示</title> </head> <body> 用戶註冊<form action=mailto:[email protected] method=get name=haha> 姓名：<input type=text name=username size=20><br> 密碼：<input type=password name=password size=20 maxlength=30><br> 網址：<input type=text name=URL size=20 maxlength=50 value=http:/ /><br> <INPUT type= BUTTON name= field_name value= 普通按鈕> <INPUT type= SUBMIT name= field_name value= 提交按鈕> <INPUT type= RESET name= field_name value= 重置按鈕> </from> </body></html>
保存之後，打開文件看看，如(圖4)所示。我想相似的圖片應該也大家見過吧，最多的就是在註冊用戶時使用。
(圖4)
5. 隱藏域HIDDEN
隱藏域在頁面中對於我們用戶來說是看不到的，因為他被隱藏起來了，在表單中插入隱藏域的目的就是在於收集或發送信息。我們在點擊提交按鈕發送表單數據的時候，隱藏域的信息也被一起發送到了服務器中。他的基本語法是<INPUT type=field_name value=value>。我之所以也給大家講解在隱藏是因為很多程序在寫程序認為這個是隱藏起來的，認為用戶看不到，所以很多情況下是沒有隱藏域的參數進行檢測和過濾，所以發生了很多安全事故。三、文本域標記<TEXTAREA>
這個標記通常用來網頁中做多行的文字域，這樣可以輸入更多的文本，用的最多的是在文章的評論中。
它的基本語法是:
<TEXTAREA name=name rows=value cols=value value=value></TEXTAREA>
，它所具有的屬性如下表所示。
文本域標記屬性 | 描述 |
name | 文本域的名稱 |
rows | 文本域的行數 |
cols | 文本域的列數 |
Value | 文本域的默認值 |
下面結合一個例子來具體說明，讓大家從實踐中明白這不是很難。具體代碼如下：
<html> <head> <title>文本域功能演示</title> </head> <body> 用戶調查<form action=mailto:[email protected] method=get name=haha> 留言板：<br> <TEXTAREA name=comment rows=5 cols=40 ></TEXTAREA><br> <INPUT type= SUBMIT name= field_name value= 提交留言> </form> </body></html>
保存代碼和改了後綴名之後打開看看，是不是和網上的留言板一樣呢，如(圖5)所示。
(圖5)