html5中valid、invalid、required的定義
發(fā)布時間:2014-02-21 16:37:55 作者:佚名
我要評論

HTML5的出現(xiàn)為我們提供一些屬性,不用編寫js和正則即可解決這個檢驗表單內(nèi)容,下面為大家介紹下valid、invalid、required的定義
css3 提示只適用于高級瀏覽器:
Chrome
Firefox
Safari
IE9+
valid、invalid、required的定義
代碼如下
input:required, input:valid , input:invalid{border:0 none; outline: 0 none; -webkit-box-shadow:none; -moz-box-shadow:none; -ms-box-shadow:none; -o-box-shadow:none; box-shadow: none;}
過去驗證表單會通過js和正則去判斷填寫的內(nèi)容是否正確,如email的驗證。
HTML5的出現(xiàn)為我們提供一些屬性,不用編寫js和正則即可解決這個檢驗表單內(nèi)容。
:required
必須,那input不能為空的意思。
:valid
有效,即當(dāng)填寫的內(nèi)容符合要求的時候觸發(fā)。
:invalid
無效,即當(dāng)填寫的內(nèi)容不符合要求的時候觸發(fā)。
Chrome
Firefox
Safari
IE9+
valid、invalid、required的定義
代碼如下
復(fù)制代碼
代碼如下:input:required, input:valid , input:invalid{border:0 none; outline: 0 none; -webkit-box-shadow:none; -moz-box-shadow:none; -ms-box-shadow:none; -o-box-shadow:none; box-shadow: none;}
過去驗證表單會通過js和正則去判斷填寫的內(nèi)容是否正確,如email的驗證。
HTML5的出現(xiàn)為我們提供一些屬性,不用編寫js和正則即可解決這個檢驗表單內(nèi)容。
:required
必須,那input不能為空的意思。
:valid
有效,即當(dāng)填寫的內(nèi)容符合要求的時候觸發(fā)。
:invalid
無效,即當(dāng)填寫的內(nèi)容不符合要求的時候觸發(fā)。
相關(guān)文章
- 這篇文章主要介紹了HTML5表單驗證特性的一些知識點,本文通過實例代碼截圖的形式給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-03-10
- 很多朋友進行表單驗證的時候,都是自己用jquery或者js手工驗證,或者用一下jquery插件進行驗證。感覺html5自帶驗證不是很好用,下面小編給大家分享使用純html5編寫的一個表2017-09-12
- 這篇文章主要介紹了HTML5 表單驗證失敗的提示語問題的相關(guān)資料,需要的朋友可以參考下2017-07-13
- 這篇文章主要介紹了使用HTML5和CSS3表單驗證功能,需要的朋友可以參考下2017-05-05
- 在HTML5 中,在增加了大量的表單元素與屬性的同時,也增加了大量在提交時對表單與表單內(nèi)新增元素進行內(nèi)容有效性驗證的功能,接下來我們來講一下自動驗證,需要的朋友參考2017-01-11
HTML5利用約束驗證API來檢查表單的輸入數(shù)據(jù)的代碼實例
這篇文章不會去討論簡單的input type,本文想把重點放在HTML5表單驗證機制上。主要介紹是HTML5是如何利用約束驗證API來檢查表單的輸入數(shù)據(jù)的,當(dāng)然,本文會涉及到很多其它2016-12-20html5的input的required使用中遇到的問題及解決方法
這篇文章主要介紹了h5的input的required使用中遇到的問題及解決方法,文中給大家介紹的非常詳細,具有參考借鑒價值,需要的朋友參考下吧2018-04-24wordpress添加Html5的表單驗證required方法小結(jié)
這篇文章主要介紹了wordpress添加Html5的表單驗證required方法小結(jié),本文通過實例代碼給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參2020-08-18