html5中valid、invalid、required的定义
发布时间：2014-02-21 16:37:55 作者：佚名 
我要评论
我要评论HTML5的出现为我们提供一些属性，不用编写js和正则即可解决这个检验表单内容，下面为大家介绍下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和正则去判断填写的内容是否正确，如email的验证。
HTML5的出现为我们提供一些属性，不用编写js和正则即可解决这个检验表单内容。
:required
必须，那input不能为空的意思。
:valid
有效，即当填写的内容符合要求的时候触发。
:invalid
无效，即当填写的内容不符合要求的时候触发。
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和正则去判断填写的内容是否正确，如email的验证。
HTML5的出现为我们提供一些属性，不用编写js和正则即可解决这个检验表单内容。
:required
必须，那input不能为空的意思。
:valid
有效，即当填写的内容符合要求的时候触发。
:invalid
无效，即当填写的内容不符合要求的时候触发。
相关文章
这篇文章主要介绍了HTML5表单验证特性的一些知识点，本文通过实例代码截图的形式给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2020-03-10
很多朋友进行表单验证的时候，都是自己用jquery或者js手工验证，或者用一下jquery插件进行验证。感觉html5自带验证不是很好用，下面小编给大家分享使用纯html5编写的一个表2017-09-12- 这篇文章主要介绍了HTML5 表单验证失败的提示语问题的相关资料,需要的朋友可以参考下2017-07-13
这篇文章主要介绍了使用HTML5和CSS3表单验证功能,需要的朋友可以参考下2017-05-05- 在HTML5 中，在增加了大量的表单元素与属性的同时，也增加了大量在提交时对表单与表单内新增元素进行内容有效性验证的功能，接下来我们来讲一下自动验证，需要的朋友参考2017-01-11
- 这篇文章不会去讨论简单的input type，本文想把重点放在HTML5表单验证机制上。主要介绍是HTML5是如何利用约束验证API来检查表单的输入数据的，当然，本文会涉及到很多其它2016-12-20
html5的input的required使用中遇到的问题及解决方法
这篇文章主要介绍了h5的input的required使用中遇到的问题及解决方法，文中给大家介绍的非常详细，具有参考借鉴价值，需要的朋友参考下吧2018-04-24
wordpress添加Html5的表单验证required方法小结
这篇文章主要介绍了wordpress添加Html5的表单验证required方法小结,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参2020-08-18
最新评论