HTML基礎教程（11）——HTML表單--

標籤：style   blog   http   使用   strong   檔案   

HTML 表單用於搜集不同類型的使用者輸入。

執行個體

文本域(Text fields)

本例示範如何在 HTML 頁面建立文本域。使用者可以在文本域中寫入文本。

密碼域

本例示範如何建立 HTML 的密碼域。

（可以在本頁底端找到更多執行個體。）

表單

表單是一個包含表單元素的地區。

表單元素是允許使用者在表單中（比如：文本域、下拉式清單、單選框、複選框等等）輸入資訊的元素。

表單使用表單標籤（<form>）定義。

<form>  <input>  <input></form>

輸入

多數情況下被用到的表單標籤是輸入標籤（<input>）。輸入類型是由類型屬性（type）定義的。大多數經常被用到的輸入類型如下：

文本域（Text Fields）

當使用者要在表單中鍵入字母、數字等內容時，就會用到文本域。

<form>First name: <input type="text" name="firstname"><br>Last name: <input type="text" name="lastname"></form>

瀏覽器顯示如下：

注意，表單本身並不可見。同時，在大多數瀏覽器中，文本域的預設寬度是20個字元。

選項按鈕（Radio Buttons）

當使用者從若干給定的的選擇中選取其一時，就會用到單選框。

<form><input type="radio" name="sex" value="male"> Male<input type="radio" name="sex" value="female"> Female</form>

瀏覽器顯示如下：

注意，只能從中選取其一。

複選框（Checkboxes）

當使用者需要從若干給定的選擇中選取一個或若干選項時，就會用到複選框。

<form><input type="checkbox" name="bike">I have a bike<br><input type="checkbox" name="car">I have a car</form>

瀏覽器顯示如下：

表單的動作屬性（Action）和確認按鈕

當使用者單擊確認按鈕時，表單的內容會被傳送到另一個檔案。表單的動作屬性定義了目的檔案的檔案名稱。由動作屬性定義的這個檔案通常會對接收到的輸入資料進行相關的處理。

<form name="input" action="html_form_action.asp" method="get">Username: <input type="text" name="user"><input type="submit" value="Submit"></form>

瀏覽器顯示如下：

假如你再上面的文字框內鍵入幾個字母，並且點擊確認按鈕，那麼輸入資料會被傳送到名為"html_form_action.asp"的頁面。那一頁將顯示出輸入的結果。

更多執行個體

複選框

本例示範如何在 HTML 頁中建立複選框。使用者可以選中或取消選取複選框。

選項按鈕

本例示範如何在 HTML 中建立選項按鈕。

簡單的下拉式清單

本例示範如何在 HTML 頁面中建立簡單的下拉式清單方塊。下拉式清單方塊是一個可選列表。

另一個下拉式清單

本例示範如何建立一個簡單的帶有預選值的下拉式清單。（譯者註：預選值指預先指定的喜好設定。）

文本域(Textarea)

本例示範如何建立一個文本域（多行文本輸入控制項）。使用者可以在文本域中寫入文本。在文本域中，可寫入的字元字數不受限制。

建立按鈕

本例示範如何建立按鈕。你可以對按鈕上的文字進行自訂。

Fieldset around data

本例示範如何在資料周圍繪製一個帶標題的框。表單一實例

帶有輸入框和確認按鈕的表單

本例示範如何向頁面添加表單。此表單包含兩個輸入框和一個確認按鈕。

帶有複選框的表單

此表單包含兩個複選框和一個確認按鈕。

帶有選項按鈕的表單

此表單包含兩個單選框和一個確認按鈕。

從表單寄送電子郵件

此例示範如何從表單寄送電子郵件。

表單標籤

標籤	描述
<form>	定義供使用者輸入的表單
<input>	定義輸入欄位
<textarea>	定義文本域 (一個多行的輸入控制項)
<label>	定義一個控制的標籤
<fieldset>	定義域
<legend>	定義域的標題
<select>	定義一個挑選清單
<optgroup>	定義選項組
<option>	定義下拉式清單中的選項
<button>	定義一個按鈕
<isindex>	已廢棄。有<input>代替。