js form 表單屬性學習

1、<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的校驗方法起衝突。