博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
3.29课·········表单验证和事件
阅读量:4469 次
发布时间:2019-06-08

本文共 3066 字,大约阅读时间需要 10 分钟。

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

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

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

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

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

(5).其它验证

2、正则表达式

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

^ :匹配开头,$:匹配结尾 ; /^e/以e开头的 /e$/以e结尾\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:事件在用户按下并放开任何字母数字键时发生。但是系统按钮(例如:箭头键、功能键)无法得到识别。

例1:根据正则表达式验证邮箱:

例2:正则表达式验证身份证(18位数):

function shenfen18(){    var a=document.getElementById("2").value;    var b=new RegExp(/^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{4}$/)    if(b.test(a))    {        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”。

 

 

转载于:https://www.cnblogs.com/xinghun/p/5352360.html

你可能感兴趣的文章
Delphi 10 seattle 去掉自带的代码连接线
查看>>
构建高并发高可用的电商平台架构实践(转)
查看>>
Geometry Imager Viewport Filter
查看>>
九度oj 题目1025:最大报销额
查看>>
数字及字符串
查看>>
【转载】OmniGraffle (二)基础绘图和模具
查看>>
一些提高开发效率的 Category
查看>>
拓扑排序基础题——排序
查看>>
转:iphone 申请证书
查看>>
Python就业方向
查看>>
一步步学习SPD2010--第二章节--处理SP网站(3)--创建网站层次架构
查看>>
TCP
查看>>
Excel常用函数大全
查看>>
团队-团队编程项目中国象棋-模块测试过程
查看>>
10个经典的C语言面试基础算法及代码
查看>>
普通的java Ftp客户端的文件上传
查看>>
视图系统
查看>>
Palindromes _easy version
查看>>
vue 小记
查看>>
CURRICULUM VITAE
查看>>