1、表单验证<form></form>

(1).非空验证(去空格)

(2).对比验证(跟一个值对比)

(3).范围验证(根据一个范围进行判断)

(4).固定格式验证:电话号码,身份证号,邮箱,信用卡号等的验证;需要用到正则表达式来进行验证。

(5).其它验证

2、正则表达式

用符号来描述书写规则:/ 中间写正则表达式 /

^ :匹配开头,$:匹配结尾 ; /^ve/以ve开头的 /ve$/以ve结尾

\d:一个任意的数字

\w:一个任意的数字或字母

\s:一个任意的字符串

{n}:把左边的表达式重复n遍

{m,n}:把左边的表达式重复至少m遍,至多n遍     {m, }:把左边的表达式重复至少m遍,,至多不限

+:左边的表达式,至少出现一次,至多不限,相当于{1,}

*:左边的表达式,至少出现0次,至多不限,相当于{0,}

?:左边的表达式,至少出现0次,至多出现1次,相当于{0,1}

[a,b,c]:只能取方括号中内容之一

[a-z]或[1-9]:在范围中取其一

|:代表或者; ():优先级; \:转义--“\( \)”这个才是要出现的小括号,需要转义

3、事件

事件有三要素:事件源、事件数据、事件处理程序

事件冒泡:当元素嵌套的时候,内部元素激发某个事件后,默认情况下外部元素相应的事件也会跟着依次触发

可以加return false;是阻止默认操作

onclick: 鼠标单击触发

ondblclick: 双击触发

onmouseover: 鼠标移动上面触发

onmouseout: 鼠标离开时触发

onmousemove: 鼠标在上面移动时触发

onchange: 只要内容改变触发

onblur: 失去焦点时触发

onfocus: 获得焦点时触发

onkeydown: 按键按下的时候触发

onkeyup:按键抬起来的时候触发

onkeypress:事件在用户按下并放开任何字母数字键时发生。但是系统按钮(例如:箭头键、功能键)无法得到识别。

正则表达式补充:

建立正则表达式的方法:

var patten= new RegExp(/^[0-9]{17}[0-9|X]$/);/*RegExp()括号里面的式子需要自己定义:

1、[]里面只有一个元素

2、()里面可以写一个单词或者式子

3、{}里面表示数量

4、^:以某个元素开头,写在元素前面

5、$:以某个元素结束,写在元素后面*/

例:

1、正则表达式验证身份证:

身份证:<input type="text" id="1"  />

/*javascript部分*/

var a= document.getElementById("1").value;

var patten= new RegExp(/^[0-9]{17}[0-9|X]$/);

if(patten.test(a))

{

  alert("输入正确");

}

else

{

   alert("输入错误");

}

2、正则表达式验证邮箱:

邮箱:<input type="text" id="2" /><input type="button" value="提交" onclick="mail()" />

function mail()

{

  var patten2=new RegExp(/^[0-9|A-z|_]{1,17}[@][0-9|A-z]{1,3}.(com)$/)

  var mail = document.getElementById("2").value;

  if(patten2.test(mail))

   {

    alert("输入正确");

  }

  else

  {

    alert("输入错误");

  }

}

常用正则表达式:

匹配国内电话号码:d{3}-d{8}|d{4}-d{7}    评注:匹配形式如 0511-4405222 或 021-87888822    

匹配腾讯QQ号:[1-9][0-9]{4,}                   评注:腾讯QQ号从10000开始    

匹配中国邮政编码:[1-9]d{5}(?!d)            评注:中国邮政编码为6位数字    

匹配身份证:d{15}|d{18}                    评注:中国的身份证为15位或18位    

匹配ip地址:d+.d+.d+.d+                        评注:提取ip地址时有用    

匹配特定数字:

^[1-9]d*$    //匹配正整数    

^-[1-9]d*$   //匹配负整数    

^-?[1-9]d*$   //匹配整数    

^[1-9]d*|0$  //匹配非负整数(正整数 + 0)    

^-[1-9]d*|0$   //匹配非正整数(负整数 + 0)    

^[1-9]d*.d*|0.d*[1-9]d*$   //匹配正浮点数    

^-([1-9]d*.d*|0.d*[1-9]d*)$  //匹配负浮点数    

^-?([1-9]d*.d*|0.d*[1-9]d*|0?.0+|0)$  //匹配浮点数    

^[1-9]d*.d*|0.d*[1-9]d*|0?.0+|0$   //匹配非负浮点数(正浮点数 + 0)    

^(-([1-9]d*.d*|0.d*[1-9]d*))|0?.0+|0$  //匹配非正浮点数(负浮点数 + 0)    

评注:处理大量数据时有用,具体应用时注意修正

匹配特定字符串:    

^[A-Za-z]+$  //匹配由26个英文字母组成的字符串    

^[A-Z]+$  //匹配由26个英文字母的大写组成的字符串    

^[a-z]+$  //匹配由26个英文字母的小写组成的字符串    

^[A-Za-z0-9]+$  //匹配由数字和26个英文字母组成的字符串    

^w+$  //匹配由数字、26个英文字母或者下划线组成的字符串

在使用RegularExpressionValidator验证控件时的验证功能及其验证表达式介绍如下:    

只能输入数字:“^[0-9]*$”    

只能输入n位的数字:“^d{n}$”    

只能输入至少n位数字:“^d{n,}$”    

只能输入m-n位的数字:“^d{m,n}$”    

只能输入零和非零开头的数字:“^(0|[1-9][0-9]*)$”    

只能输入有两位小数的正实数:“^[0-9]+(.[0-9]{2})?$”    

只能输入有1-3位小数的正实数:“^[0-9]+(.[0-9]{1,3})?$”    

只能输入非零的正整数:“^+?[1-9][0-9]*$”    

只能输入非零的负整数:“^-[1-9][0-9]*$”    

只能输入长度为3的字符:“^.{3}$”    

只能输入由26个英文字母组成的字符串:“^[A-Za-z]+$”    

只能输入由26个大写英文字母组成的字符串:“^[A-Z]+$”    

只能输入由26个小写英文字母组成的字符串:“^[a-z]+$”    

只能输入由数字和26个英文字母组成的字符串:“^[A-Za-z0-9]+$”    

只能输入由数字、26个英文字母或者下划线组成的字符串:“^w+$”

验证用户密码:“^[a-zA-Z]w{5,17}$”正确格式为:以字母开头,长度在6-18之间,    只能包含字符、数字和下划线。    

验证是否含有^%&'',;=?$"等字符:“[^%&'',;=?$x22]+”    

只能输入汉字:“^[u4e00-u9fa5],{0,}$”    

验证Email地址:“^w+[-+.]w+)*@w+([-.]w+)*.w+([-.]w+)*$”    

验证InternetURL:“^http://([w-]+.)+[w-]+(/[w-./?%&=]*)?$”    

验证电话号码:“^((d{3,4})|d{3,4}-)?d{7,8}$”    正确格式为:“XXXX-XXXXXXX”,“XXXX-XXXXXXXX”,“XXX-XXXXXXX”,    “XXX-XXXXXXXX”,“XXXXXXX”,“XXXXXXXX”。    

验证身份证号(15位或18位数字):“^d{15}|d{}18$”    

验证一年的12个月:“^(0?[1-9]|1[0-2])$”正确格式为:“01”-“09”和“1”“12”    

验证一个月的31天:“^((0?[1-9])|((1|2)[0-9])|30|31)$”    正确格式为:“01”“09”和“1”“31”。    

匹配中文字符的正则表达式: [u4e00-u9fa5]    

匹配双字节字符(包括汉字在内):[^x00-xff]    

匹配空行的正则表达式:n[s| ]*r    

匹配HTML标记的正则表达式:/<(.*)>.*|<(.*) />/    

匹配首尾空格的正则表达式:(^s*)|(s*$)    

匹配Email地址的正则表达式:w+([-+.]w+)*@w+([-.]w+)*.w+([-.]w+)*    

匹配网址URL的正则表达式:http://([w-]+.)+[w-]+(/[w- ./?%&=]*)?

form表单验证和事件、正则表达式的更多相关文章

  1. 2016年11月6日--form表单验证和事件、正则表达式

    1.表单验证<form></form> (1).非空验证(去空格) (2).对比验证(跟一个值对比) (3).范围验证(根据一个范围进行判断) (4).固定格式验证:电话号码, ...

  2. form表单验证和事件

    1.表单验证<form></form> (1).非空验证(去空格) (2).对比验证(跟一个值对比) (3).范围验证(根据一个范围进行判断) (4).固定格式验证:电话号码, ...

  3. form表单验证-Javascript

    Form表单验证: js基础考试内容,form表单验证,正则表达式,blur事件,自动获取数组,以及css布局样式,动态清除等.完整代码如下: <!DOCTYPE html PUBLIC &qu ...

  4. python_way day19 HTML-day5 (form表单验证,CSRF,cookie,session,缓存)

    python-way day19 1. dJango的form表单验证 2.CSRF 跨站请求伪造 3.cookie,session 4.缓存 一,django表单验证功能 1.django验证基础: ...

  5. [php基础]PHP Form表单验证:PHP form validator使用说明

    在PHP网站开发建设中,用户注册.留言是必不可少的功能,用户提交的信息数据都是通过Form表单提交,为了保证数据的完整性.安全性,PHP Form表单验证是过滤数据的首要环节,PHP对表单提交数据的验 ...

  6. ASP.NET MVC Form表单验证与Authorize特性

    一.Form表单验证 1.基本概念 表单验证是一个基于票据(ticket-based)[也称为基于令牌(token-based)]的系统.当用户登录系统以后,会得到一个包含基于用户信息的票据(tick ...

  7. python26:自定义form表单验证

    一.自定义Form的原理 1.1 各种form表单验证比较 只有python提供了form表单验证,其他的都没有提供.django提供的功能还不够强大.最强大的是微软的ASP.NET!我们可以自己写一 ...

  8. vue elementui form表单验证

    最近我们公司将前端框架由easyui 改为 vue+elementui .自学vue两周 就开始了爬坑之路.业余时间给大家分享一下心得,技术新手加上第一次分享(小激动),有什么不足的地方欢迎大家指正, ...

  9. element-ui Form表单验证

    element-ui Form表单验证规则全解 element的form表单非常好用,自带了验证规则,用起来很方便,官网给的案例对于一些普通场景完全没问题,不过一些复杂场景的验证还得自己多看文档摸索, ...

随机推荐

  1. 转:ibatis常用16条SQL语句

    1.输入参数为单个值 <delete id="com.fashionfree.stat.accesslog.deleteMemberAccessLogsBefore" par ...

  2. 直接拿来用!十大Material Design开源项目

    来自:http://www.csdn.net/article/2014-11-21/2822753-material-design-libs/1 介于拟物和扁平之间的Material Design自面 ...

  3. Android UX & UI 最佳实践: 设计有效的导航

    Best Practices for User Experience & UI Designing Effective Navigation 导航:帮助用户有效直观地使用你的应用. Plann ...

  4. DropDownList 添加一个"请选择"或"全部"之类的项

    DropDownList在从数据库中得到数据源绑定后,添加一个"请选择"或"全部"之类的项 1:直接添加:<asp:ListItem Value=&quo ...

  5. iOS关于CAShapeLayer与UIBezierPath的知识内容

    使用CAShapeLayer与UIBezierPath可以实现不在view的drawRect方法中就画出一些想要的图形 . 1:UIBezierPath: UIBezierPath是在 UIKit 中 ...

  6. exec

    之前一直这样显示 不知道修改了什么,变成了这样. 在终端   找到这个podfile所在的目录 chmod 600 podfile   然后 就变回来了.可能是修改权限的问题.

  7. Linux下怎么查看当前系统的版本

    Linux下怎么查看当前系统的版本:   uname -r 功能说明:uname用来获取电脑和操作系统的相关信息. 语 法:uname [-amnrsvpio][--help][--version] ...

  8. [转]三大WEB服务器对比分析(apache ,lighttpd,nginx)

    原博文地址:http://www.blogjava.net/daniel-tu/archive/2008/12/29/248883.html 一.软件介绍(apache  lighttpd  ngin ...

  9. EnumMap

    以下内容基于jdk1.7.0_79源码: 什么是EnumMap Map接口的实现,其key-value映射中的key是Enum类型: 补充说明 其原理就是一个对象数组,数组的下标索引就是根据Map中的 ...

  10. 集合1--毕向东java基础教程视频学习笔记

    Day14 集合框架01 体系概述02 共性方法03 迭代器04 List集合共性方法05 ListIterator06 List集合具体对象特点07 Vector中的枚举 01 体系概述 集合类为什 ...