欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

HTML 表单和验证事件

程序员文章站 2022-05-11 09:14:04
...
1、表单验证

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

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

function checkemail() { var v4 = trim(u4.value); var reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/; if(v4.match(reg) != null) { imgs4.setAttribute("src","imges/1.png"); return true; } else { imgs4.setAttribute("src","imges/2.png"); return false; } }

正则表达式补充:

建立正则表达式的方法:

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

1[]里面只有一个元素

2()里面可以写一个单词或者式子3{}里面表示数量
4^:以某个元素开头,写在元素前面
5$:以某个元素结束,写在元素后面*/

例:

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、正则表达式验证邮箱:

邮箱:提交