Web前端表单验证
表单选择器
|
:input(匹配所有input、textarea、select和button元素) |
|
|
:text(匹配所有单行文本框) |
|
|
:password(匹配所有密码框) |
|
|
:radio(匹配所有单项按钮) |
|
|
:checkbox(匹配所有复选框) |
|
|
:submit(匹配所有提交按钮) |
|
|
:image(匹配所有图像域) |
|
|
:reset(匹配所有重置按钮) |
|
|
:button(匹配所有按钮) |
|
|
:file(匹配所有文件域) |
|
|
:hidden(匹配所有不可见元素,或者type为hidden的元素) |
表单属性过滤器
|
语法 |
描述 |
实例 |
|
|
:enabled |
匹配所有可见元素 |
||
|
:disabled |
匹配所有不可用元素 |
||
|
:checked |
匹配所有被选中元素(复选框,单项按钮,select中的option) |
||
|
:selected |
匹配所有选中的option元素 |
||
表单验证常用的方法和事件
事件:onblur:失去焦点,当光标离开某个文本框时触发
Onfocus:获取焦点,当光标进入某个文本框时触发
方法:blur()从文本域移开焦点
Focus()在文本域中设置焦点,即获得光标
Select()获取文本域中的内容,突出显示输的区域的内容
文本输入提示特效示例
$(“myform:text”).focus(function(){
If($(this).val()==”请输入正确的电子邮箱”){
$(this).val(“”);
$(this).css(“border”,”1px solid #ff0000”);
}
})
什么是正则表达式
正则表达式是一个描述字符模式的对象,它是由一些特殊符号组成的,这些特殊符号和在SQL server中学过的通配符一样
RegExp对象是Regular Expression(正则表达式)的缩写,验证(电子邮箱地址,电话号码,身份证号等字符串)
定义正则表达式有两种形式:一种是普通方式,另一种是构造函数的方式
普通方式:
Var reg=/表达式/附加参数
附加参数有三个参数:
g:代表可以进行全局匹配
I:代表不区分大小写匹配
m:代表可以进行多行匹配
构造函数
Var reg =new RegExp(“表达式”,”附加参数”)
表示式的模式分为简单模式和复合模式
正则表达式的常用字符
- /../代表模式的开始和结束
- ^匹配字符串的开始
- $匹配字符串的结束
- \s任何空白字符
- \S任何非空白字符
- \d匹配一个数字字符等价于[0-9]
- \D除了数字之外的任何字符,等价于[^0-9]
- \w匹配一个数字、下划线或字母字符,等价于[A-Za-z0-9]
- \W任何非字字符,等价于[^A-Za-z0-9]
- .除了换行符之外的任意字符
正则表达式的重复字符
{n}匹配前一项n次
{n,}匹配前一项n次,或者多次
{n,m}匹配前一项至少n次,但不能超过m次
次,或者多次,等价于{0,}
次,或者多次,等价于{1,}
次,也就是说前一项是可选的,等价于{0,1}
Web前端表单验证的更多相关文章
- HTML5 web Form表单验证实例
HTML5 web Form 的开发实例! index.html <!DOCTYPE html> <html> <head> <meta charset=&q ...
- Web开发-表单验证
表单验证是Web开发中必不可少的一个环节,用来限制用户输入数据的规范和一致性.那么如何能够简化这一任务,让开发人员通过简单的属性设置就能达到目的呢? FineUI在这一点上也是下足了功夫,比Asp.N ...
- (七)JavaScript之[调试]与[前端表单验证]
12].调试为什么要去调试?1.在编写JavaScript时,如果没有调试工具将是一件很痛苦的事情.2.没有调试工具是很难去编写JavaScript程序的.3.编写的代码可能包含语法错误.逻辑错误,如 ...
- Java web 之表单验证
按照软件工程师的定位来讲,表单验证应该要好好练习的 html javascript
- jQuery简单前端表单验证
<!DOCTYPE html> <html> <head> <title>表单验证</title> <script src=" ...
- 前端表单验证常用的15个JS正则表达式
在表单验证中,使用正则表达式来验证正确与否是一个很频繁的操作,本文收集整理了15个常用的javaScript正则表达式,其中包括用户名.密码强度.整数.数字.电子邮件地址(Email).手机号码.身份 ...
- 最常用的15个前端表单验证JS正则表达式
在表单验证中,使用正则表达式来验证正确与否是一个很频繁的操作,本文收集整理了15个常用的JavaScript正则表达式,其中包括用户名.密码强度.整数.数字.电子邮件地址(Email).手机号码.身份 ...
- Web前端——表单提交和Js添加选项
表单 表单提交 表单提交之后会将表单的数据以get或post方式,传送到action要打开的页面 方式1: 使用提交按钮 <form action="" method=&qu ...
- 4.前端注册表单验证 && 表单回填
表单验证 前端表单验证就是在 jsp 页面中添加验证逻辑,使得注册表单在传入后台之前先进行一次表单验证 在jsp文件里的 head 块里面添加 jQuery 代码 <script type=&q ...
随机推荐
- 用webpack实现前端自动化构建
什么是自动化的前端构建流? 1. 自动补全css私有前缀,自动转化less\sass为css,自动转化es6\vue\jsx语法为js,自动打包小图片为base64以减少http请求,自动给js,cs ...
- Oracle 完整性约束错误
错误Caused by: org.hibernate.exception.ConstraintViolationException: Could not execute JDBC batch upd ...
- 从golang-gin-realworld-example-app项目学写httpapi (五)
https://github.com/gothinkster/golang-gin-realworld-example-app/blob/master/users/middlewares.go 中间件 ...
- cache2go开源项目的回调方法使用
https://github.com/muesli/cache2go 结构体 type CacheTable struct { sync.RWMutex . name string items map ...
- Scratch3.0——项目层次结构
原文地址:https://blog.csdn.net/weiwoyonzhe/article/details/86603757 简要介绍: 本文旨在介绍scratch3.0项目层次结构及关键功能. 源 ...
- P2DR模型
P2DR模型是可适应网络安全理论或称为动态信息安全理论的主要模型.P2DR模型是TCSEC模型的发展,也是目前被普遍采用的安全模型.P2DR模型包含四个主要部分:Policy(安全策略).Protec ...
- August 18th 2017 Week 33rd Friday
If you shed tears when you miss the sun, you also miss the stars. 如果你因为错过太阳而哭泣,你也将会错过繁星. If you have ...
- codeforces 497E Subsequences Return
codeforces 497E Subsequences Return 想法 做完这题,学了一些东西. 1.求一个串不同子序列个数的两种方法.解一 解二 2.这道题 \(n\) 很大,很容易想到矩阵加 ...
- Linux基础入门 - 2
第三节 用户及文件权限管理 3-1.Linux用户管理 Linux 是一个可以实现多用户登陆的操作系统,他们共享一些主机的资源,但他们也分别有自己的用户空间,用于存放各自的文件.但实际上他们的文件都是 ...
- [attribute |= value] 与 [attribute ^= value],[attribute ~= value] 与 [attribute *= value] 的联系与区别
[attribute |= value] 与 [attribute ^= value] 的联系与区别: 一.联系: 1. 两个选择器的 attribute 属性值等于 value 时都可以匹配 < ...