html5新增屬性:
屬性描述
placeholder
提供一種提示,輸入域為空時顯示,獲得焦點輸入內容後消失
required
規定輸入域不能為空
pattern
規定驗證input域的模式(正規表示式)
示例:validity屬性:
validitystate物件:
屬性描述
valuemissing
表單元素設定了required屬性,則為必填項,如果必填項的值為空,則無法通過表單的驗證,valuemissing的值會返回true否則返回false
typemismatch
輸入值與type型別不匹配.html5新增的表單型別如email,number,url等,都包含乙個原始的型別驗證,如果使用者輸入的值與表單型別不匹配,則typemismatch的值返回true,否則返回false
patter****match
輸入值與pattern特性的正規表示式不匹配,如果輸入的值不符合pattern驗證模式的規則,則patter****match的值返回true否則返回false
toolong
輸入的內容超過了表單元素的maxlength特性限定的字元長度,雖然在輸入的時候會限制表單內容的長度,但在某種情況下,如通過程式設定,還是會超出最大長度設定,如果輸入內容超出了最大長度設定,則toolong值返回true否則返回false
rangeunderflow
輸入的值小於min特性的值,如果輸入的數值小於最小值,則rangeunderflow的值返回true,否則返回false
rangeoverflow
輸入的值大於max特性的值,如果輸入的值大於最大值,則rangeoverflow的值返回true,否則返回false
stepmismatch
輸入的值不符合step屬性推算出的規則.用於填寫數值的表單元素可能需要同時設定min,max和step的屬性,這就限制了輸入的值必須是最小值與step屬性值的倍數之和,例如:範圍從0到10,step特性值為2,因為合法值為該範圍的偶數,其他數值均無法通過驗證。如果輸入的值不符合要求則stepmismatch返回true否則返回false
customerror
使用自定義的錯誤驗證資訊.使用setcustomvalidity()方法自定義錯誤提示資訊:setcustomvalidity(message)會把錯誤提示資訊設定為message,此時customerror的值為true,setcustomvalidity(「」)會清除定義的錯誤提示資訊,此時customerror的值為false
HTML5表單驗證
在網上搜尋表單驗證，大多數都是js寫的，比較複雜。但是翻閱了html5的新標籤之後，發現html5原生支援對正規表示式 非空的檢測，即pattern，required標籤。如下即可實現該輸入框非空，且是正整數 不過在提交表單時，如果輸入框不合規範，預設的提示並不友好，如果想要更改預設的提示，需要加入...
HTML5新增的表單驗證功能
html5 表單增加了許多內建的控制項和控制項屬性 xhtml 中需要放在 form 之中的諸如 input button select textarea 等標籤元素，在 html 5 中完全可以放在頁面任何位置，並通過新增的 form 屬性指向元素所屬表單的 id 值，即可關聯起來。email輸入...
html5表單自動驗證
在html5 中，在增加了大量的表單元素與屬性的同時，也增加了大量在提交時對表單與表單內新增元素進行內容有效性驗證的功能，接下來我們來講一下自動驗證。在html5中，通過對元素使用屬性的方法，可以實現在表單提交時執行自動驗證的功能，在執行 後，將在表單提交時自動驗證輸入的內容是否為數字，如果驗證通不...