h5表单验证的css和js方法
1.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
无效,即当填写的内容不符合要求的时候触发。
2.novalidate = novalidate 不提交表单
3.setCustomValidity()设置提示的内容
h5表单验证的css和js方法的更多相关文章
- jQuery插件 -- 表单验证插件jquery.validate.js, jquery.metadata.js
原文地址:http://blog.csdn.net/zzq58157383/article/details/7718352 最常使用JavaScript的场合就是表单的验证,而jQuery作为一个 ...
- jQuery插件 -- 表单验证插件jquery.validate.js
最常使用JavaScript的场合就是表单的验证,而jQuery作为一个优秀的JavaScript库,也提供了一个优秀的表单验证插件----Validation.Validation是历史最悠久的jQ ...
- 表单验证插件jquery.validate.js
最常使用JavaScript的场合就是表单的验证,而jQuery作为一个优秀的JavaScript库,也提供了一个优秀的表单验证插件----Validation.Validation是历史最悠久的jQ ...
- H5: 表单验证失败的提示语
前言 前端的童鞋在写页面时, 都不可避免的总会踩到表单验证这个坑. 这时候, 我们就要跪了, 因为要写一堆js来检查. 但是自从H5出现后, 很多常见的表达验证, 它都已经帮我们实现了, 让我 ...
- 表单验证插件 jquery.validata 使用方法
参考资料:http://www.runoob.com/jquery/jquery-plugin-validate.html 下载地址 jquery.validate插件的文档地址http://docs ...
- jquery validate表单验证插件的基本使用方法及功能拓展
1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家. 1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素 3.鼠标离开后的正确.错误提示及鼠标移入时的帮助提 ...
- jQuery表单验证插件——jquery.validate.js
官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation 一.导入js库 <script src="../j ...
- 表单验证控件Verify.js
自己工作常用到表单录入验证,就顺手写了一个验证控件,刚开始写得很烂.多年后翻出来,又优化了一下,增加了一些功能.拿出来分享分享. 主要功能就是表单的录入验证. * 1.当录入框必填时,在控件后生成红色 ...
- jquery表单验证插件 jquery.form.js ------转载
Form插件,支持Ajax,支持Ajax文件上传,功能强大,基本满足日常应用. 1.JQuery框架软件包下载 文件: jquery.rar 大小: 29KB 下载: 下载 2.Form插件下载 文件 ...
随机推荐
- QT 图形视图框架
https://blog.csdn.net/qq769651718/article/details/79357936 使用QPushButton.QLabel.QCheckBox等构成GUI的控件或自 ...
- Vue之父子组件的通信
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Eclipse调试:项目在Debug模式下,无法启动的问题
问题:Eclipse中调试Java项目时,使用正常模式:Run 项目名,可以正常启动.当想打断点调试时,点击Debug按钮后,项目显示 Source not found,或者弹出窗口显示服务器在45秒 ...
- iOS旋屏
横竖屏切换,视图乱了怎么办? 首先,我们必须了解一下下列4种状态,它们被用来描述设备旋转方向: UIInterfaceOrientationLandscapeLeft 向左,即HOME键在右 UIIn ...
- odoo10 fields.Selection 根据权限显示不同的selection内容
摘要:一般作为下拉选项,selection的选项内容是固定,针对一些特殊要求,根据权限组显示不同的selection内容的,可以参考odoo源码的. 前提:基于 odoo10.0 的源码 参考源码1: ...
- HTML 显示和隐藏浏览器滚动条
滚动条和overflow有关 显示: overflow-x:auto; overflow-y:auto; overflow-x:scroll; overflow-y:scroll; 隐藏: overf ...
- vue+element UI如何导出excel表
导出excel表应按如下规则 首先要先安装如下依赖 npm install --save xlsx npm install --save file-saver 接下在在你的代码中去引用这两个 impo ...
- [POJ] 2411 Mondriaan's Dream
Mondriaan's Dream Time Limit: 3000MS Memory Limit: 65536K Total Submissions: 18903 Accepted: 10779 D ...
- opencast 视频捕获代理 pyCA安装和功能实现
pyCA安装过程: 36 git clone https://github.com/opencast/pyCA.git 37 cd pyCA/ 41 yum install python-pycurl ...
- 《零基础入门学习Python》【第一版】视频课后答案第004讲
1.while语句中,当条件为真时,它会一直循环下去,比如下面的例子,不过可以用Ctral + C来强制结束 while 'C': print("i love you") 2.观察 ...