js form 表單屬性學習


一、<form></form>標簽      引用借鑒:http://www.cnblogs.com/fizx/p/6703370.html

form標簽的屬性規定了當前網頁上傳數據的地址和方式。

1.1 action 屬性(常用)

action:接受請求的URL;URL為處理上傳數據的頁面。

1.2 method 屬性(常用)

method屬性有兩種,分別為:get、post

get:

1>采用 GET 方法發送數據時,瀏覽器會與表單處理服務器建立連接,然后直接在一個傳輸步驟中發送所有的表單數據:瀏覽器會將數據直接附在表單的 action 的 URL 之后,這兩者之間用問號進行分隔。這種方式並不安全,因為上傳的數據可以直接在URL中反映出來。

2>GET方法提交數據后的URL鏈接是可以添加書簽的,每次打開該書簽都相當於向服務器提交了相同的數據。

3>URL的長度是有限的(約3000字符),所以get方式經常用來提交較小的數據

4>結合以上特性,一般使用get方式來提交非敏感內容,比如說搜索查詢。不僅速度較快,還可以將頁面保存到書簽之中

post:

1>采用 POST 方法,瀏覽器將會按照下面兩步來發送數據。首先,瀏覽器將與 action 屬性中指定的表單處理服務器建立聯系;一旦建立連接之后,瀏覽器就會按分段傳輸的方法將數據發送給服務器。通過這種方式來上傳數據安全性較高。

2>POST方法上傳的數據沒有長度限制,可以傳輸大量的數據,所以在上傳文件只能使用Post。

3>大多數情況都應該使用POST方式進行數據的傳輸

 

1.3.accept-charset

accept-charset屬性的值規定了服務器使用哪一種字符集編碼來處理本頁面所上傳的數據。常用的有“UTF-8”、“ISO-8859-1"、"gb2312"等。

一般不推薦使用。默認屬性為:unknown  意思是與當前html 使用相同的字符集。

服務器端可以來驗證

 

1.4.name屬性

 

Form 標簽元素自身並沒有數據傳輸,它的 name 屬性只是提供了一種在腳本中引用表單的方法。與此同時,form標簽元素內的數據都是通過name來傳遞的,只有設置了 name 屬性的表單元素才能在提交表單時傳遞它們的值。

 

其余屬性還有:

5.enctype屬性

Enctype 屬性規定在發送到服務器之前應該如何對表單數據進行編碼。

1>默認的屬性是application/x-www-form-urlencoded,意味着在發送前對所有字符進行編碼,把 "+" 轉換為空格,並且把特殊字符轉換為 ASCII 十六進制值。在不涉及文件傳輸時,一般使用這種方式。

2>multipart/form-data,這種編碼類型不對字符編碼,數據通過二進制的形式傳送到服務器端。這個是專門用來傳輸特殊類型數據的,當我們上傳文件時,比如圖片、視頻、MP3等,必須要使用這種編碼方式。它的編碼方式為:把form的內容瓜分成段,每段代表一個input屬性,每個段落間用分隔符隔開。其中每個段落登記這個段落的消息,例如Content-Disposition,name,Content-Type等等,還有這個段落與下個段落的分隔符boundary,以及這個段落的value數據。

3>text/plain,將內容設置為純文本的形式,空格轉換為 "+" 加號,但不對特殊字符編碼。

 

6.target屬性

Form標簽的target屬性和a標簽的功能相似,規定了在何處打開表單上傳后的處理頁面。

1>_blank
瀏覽器總在一個新打開、未命名的窗口中載入目標文檔。
2>_self
這個目標的值對所有沒有指定目標的 <a> 標簽是默認目標,它使得目標文檔載入並顯示在相同的框架或者窗口中作為源文檔。這個目標是多余且不必要的,除非和文檔標題 <base> 標簽中的 target 屬性一起使用。
3>_parent
這個目標使得文檔載入父窗口或者包含來超鏈接引用的框架的框架集。如果這個引用是在窗口或者在頂級框架中,那么它與目標 _self 等效。
4>_top
這個目標使得文檔載入包含這個超鏈接的窗口,用 _top 目標將會清除所有被包含的框架並將文檔載入整個瀏覽器窗口。

 

7.autocomplete屬性(HTML5新增屬性)

Autocomplete 屬性規定表單是否應該啟用自動完成功能。當用戶在字段開始鍵入時,瀏覽器基於之前鍵入過的值,顯示出在該字段中填寫過的選項,從而簡化用戶的輸入。autocomplete只有兩個值,on 和 off,分別對應啟用和關閉這個功能。默認值為on。

 

8.novalidate

Novalidate屬性規定當提交表單時不對其進行驗證。通過將novalidate=novalidate屬性放置到form元素上,form元素的原生校驗特征就會忽略,這樣就可以防止它同JavaScript的校驗方法起沖突。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM