HTML的form標籤用法

一般表單內多以使用d5fd7aea971a85678ba271703566ebfd標籤收集使用者的輸入訊息，其輸入類型是由type決定的。多數情況下被用到的表單標籤是輸入標籤（d5fd7aea971a85678ba271703566ebfd）。輸入類型是由類型屬性（type）定義的。常見的輸入類型有文字網域、單選按鈕、複選框、下拉式選單等等。

 HTML中表單可以用來蒐集使用者各種類型的輸入資訊。表單實際上是包含表單元素的區域，在這個區域中的各種元素的輸入資訊最終都會透過表單提交到程式腳本中。例如常見的有使用者登入、註冊、發布文章等等，都是透過表單提交到動態程式進行處理的。本節主要講述表單和表單的元素，關於如何提交表單資訊到動態程序，將在以後的程序語言課中再來講述。
表單的區域是使用ff9c23ada1bcecdd1a0fb5d5a0f18437標籤定義表單的範圍，在ff9c23ada1bcecdd1a0fb5d5a0f18437f5a47148e367a6035fd7a2faa965022e中的元素的值會被透過這個表單提交到對應的位址中。
文字域
文字域可以提供使用者輸入文字的功能，瀏覽器會將文字域解譯為一個矩形框，使用者將遊標移到該框體，並點選即可將遊標移到框體內。使用者可在表單中鍵入字母、數字等內容。
文字域的定義方法是在d5fd7aea971a85678ba271703566ebfd標籤中為type屬性設定text值

XML/HTML Code

##複製內容到剪貼簿

2. d1c023f998101ca7a005a302da5b6b4c

3. 文字域1:cc3ca610fc9f0daf6145009aa7724be4

文字域2:

c25fd2a0a5acb93ed88d4c732d342617

1. #bce221fc27dd73f2614720652468be2b

   
   瀏覽器顯示如下：
   

   1. #單選按鈕

   單選按鈕多數情況下出現在使用者註冊時輸入資料的選項中，此類型多使用者只允許使用者選擇一項結果時使用。
   單選按鈕的定義方法是在d5fd7aea971a85678ba271703566ebfd標籤中將type屬性的值設為radio。

   <form>
   <input type=”radio” name=”sex” value=”male” /> 男生   
   <input type=”radio” name=”sex” value=”female” /> 女生   
   </form>

   
   瀏覽器中的顯示為：
   
   1. 複選框

   複選框可讓使用者勾選某些對應的一個或多個選項。常見的一般是在使用者登入時，為使用者提供記住登入帳號等功能。也可以在使用者調查的頁面中，蒐集使用者的多項意見。
   複選框定義方法是在d5fd7aea971a85678ba271703566ebfd標籤中將type屬性的值設定為checkbox

   ###

   <form>
   <input type=”checkbox” name=”val1″ />
   前端开拓者不错   
   <input type=”checkbox” name=”val2″ />
   前端开拓者一般   
   </form>

   #########瀏覽器顯示如下：## #############下拉式選單######下拉式選單在資訊選擇上與單選類似，但是下拉式選單可以容納更多的資訊。並且下拉式選單在選擇選單值後可以執行額外的腳本。 ###下拉選單以221f08282418e2996498697df914ce4e為起始標籤，在select標籤中的每一個option標籤都是下拉式選單中的一個值。 #########

   <form>
   <select name=”cars”>
   <option value=”volvo”>Volvo</option>
   <option value=”saab”>Saab</option>
   <option value=”fiat”>Fiat</option>
   <option value=”audi”>Audi</option>
   </select>
   </form>

   #########瀏覽器顯示：################提交按鈕######提交按鈕是每個表單的必要組成部分。使用者將對應的資訊輸入後，需要透過點擊提交按鈕觸發動作，將表單的值提交到下一個頁面。當ff9c23ada1bcecdd1a0fb5d5a0f18437標籤中的action屬性設定了對應的提交地址時，提交按鈕會將該表單中獲得的所有資料提交到這個地址的頁面中。 ###提交按鈕的定義方法是在input標籤中將type的值設為submit。下面以前端開拓者的搜尋框為例，將提交地址設定為搜尋頁面。 #########

   <form name=”input” action=”http://www.frontopen.com/” method=”get”>
   关键字:   
   <input type=”text” name=”s” id=”s” />
   <input type=”submit” value=”搜索” />
   </form>

   #########瀏覽器顯示如下：#########

   結論：本節只是對常用的表單前端佈局元素進行基本的示範與講解。真正的表單運用多在伺服器程式語言中運用，並且需要設定更多的參數與規則。本課中大家只需要了解表單的各元素實現排列即可，多數情況下已經基本可以配合後台程式設計師完成網站開發。

   相關推薦：

   HTML Form表單元素的詳解

   #JQuery form驗證單選方塊是否選取經驗摘要

   #微信小程式簡單實作form表單取得輸入資料實例分享

以上是HTML的form標籤用法的詳細內容。更多資訊請關注PHP中文網其他相關文章！