.HTML中表單元素的基本概念

HTML表單是HTML元素中較為復雜的部分,表單往往和腳本,動態頁面,數據處理等功能相結合,因此是制作動態網站很重要的內容.

表單一般用來收集用戶的輸入信息

2.表單工作原理

訪問者在瀏覽有表單的網頁時,可填寫必需的信息,然后按某個按鈕提交,這些信息通過網絡傳送到服務器上.服務器上專門的程序對這些數據進行處理,如果有錯誤會返回錯誤信息,并要求糾正錯誤.當數據完整無誤后,服務器反饋一個輸入完成的信息

3.表單的功能

功能:表單用于向服務器傳輸數據,從而實現用戶與WEB服務器的交互表單能夠包含input系統標簽,比如文本字段,復選框,單選框,提交按鈕等表單還可以包含textarea,select,fieldset,label標簽.

4.表單的常用類型及說明

1.表單常用的類型有:

2.表單屬性：

3.文本輸入框(text)：

當用戶要在表單中輸入字母,數字內容時,就會用到文本域

代碼如下:

注意,表單本身并不可見.同時,在大多瀏覽器中,文本域的缺省寬度是20個字符.

在密碼域中輸入的字符,瀏覽器將使用項目符號來代替這些字符.

4.單選按鈕(radio)：

當用戶從若干給定的選擇中選取一個選項時,就會用到單選框.

代碼如下:

當用戶點擊一個單選按鈕時,該按鈕會變為選中狀態,其他所有按鈕會變為非選中狀態.

5.復選框(checkboxes)

當用戶需要從若干給定的選擇中選取一個或多個選項時,就會用到復選框

代碼如下:

6.重置按鈕(reset)

重置按鈕會清除當前頁面上的用戶輸入的所有數據,把當前頁面恢復到打開時的樣子.

代碼如下:

<form><p><input type="reset"></p></form>

7.提交按鈕

會在當前頁面生成一個提交按鈕,用戶點擊此按鈕,瀏覽器就會把當前頁面用戶輸入的數據傳送到服務端

代碼如下:

<form><p><input type="button" value="按鈕"/></p></form>

8.提交文件

當需要把客戶端的文件發送到服務端時,需要用到提交文件按鈕

代碼如下:

<form action="/index/" method="post"><p><input type="file"/></p></form>

上傳文件注意兩點: 請求方式必須是post enctype="multipart/form-data"

9.下拉菜單

當需要用戶從很多選項中選擇一個或多個選項時,也可以使用下拉列表.

代碼如下:

代碼如下:

OPTION

selected="selected"

10.表單屬性

1.action屬性的說明:

使用action選項來指定服務端的腳本來處理被提交的表單

<form action="/index/" method="post">

如果省略action屬性,則action會被設置為當前頁面

2.method屬性的說明:

method屬性規定在提交表單時所用的http方法(POST或GET)

<form action="/index/" method="post">

或

<form action="/index/" method="get">

3.get方法或post方法的使用方式說明:

如果表單提交是被動的(比如搜索引擎查詢),并且沒有敏感信息.

當使用get方法時,表單的數據在頁面地址欄中是可見的

因此,get最適合少量數據的提交,瀏覽器會設定容量限制

如果表單正在更新數據,或者包含敏感信息(比如密碼)時應該使用post,post的安全性更好.

因為在頁面地址欄中被提交的數據是不可見的.

切圖 qietu(.com)

tml表單元素-html教程

表單元素文本類：

123456

表單元素-按鈕類：

復選框與單選框：

你的愛好是:

吃飯

睡覺

打豆豆

你的性別是：

男

女

文件選擇：

下拉列表與下拉框：div+css,html學習,html入門

iframeset：

iframe：

[成笑笑博客]SEO中DIV+CSS命名規則-seo教程

[成笑笑博客]HTML標簽概述-html教程

CSS樣式表知識總結-css教程

html5和html4之間的區別-html5教程