前端表单js验证笔记

09420171003

//$(function(){////});window.onload = function(){//姓名验证emp_name.onblur = function(){if(emp_name.value.length < 3){empHint.innerHTML = "姓名长度太短！";}};emp_name.onfocus = function(){empHint.innerHTML = "";};//邮箱验证ema.onblur = function(){var pattern = /^([A-Za-z0-9]){1}([A-Za-z0-9_-])+@([a-z0-9])+\.{1}((com)|(cn)|(net))$/g;if(!pattern.test(ema.value) ){emialHint.innerHTML = "邮箱格式不正确！";}};ema.onfocus = function(){emialHint.innerHTML = "";};//地址验证addr.onblur = function(){if(addr.value.length ===0){addrHint.innerHTML = "地址不能为空！";}};addr.onfocus = function(){addrHint.innerHTML = "";};//手机验证phone.onblur = function(){var pattern = /^1[3|5|7|8]\d{9}$/g;if(!pattern.test(phone.value) ){phoneHint.innerHTML = "手机格式不正确！";}};phone.onfocus = function(){phoneHint.innerHTML = "";};//电话验证tel.onblur = function(){var pattern = /\d{3}-\d{8}|\d{4}-\{7,8}/g;if(!pattern.test(tel.value) ){telHint.innerHTML = "电话格式不正确！";}};tel.onfocus = function(){telHint.innerHTML = "";};//QQ验证qq.onblur = function(){var pattern = /[1-9][0-9]{4,}$/g;if(!pattern.test(qq.value) ){qqHint.innerHTML = "QQ格式不正确！";}};qq.onfocus = function(){qqHint.innerHTML = "";};//民族验证nation.onblur = function(){if(nation.value.length === 0){nationHint.innerHTML = "不能为空！";}};nation.onfocus = function(){nationHint.innerHTML = "";};//邮编验证zip.onblur = function(){var pattern = /[1-9]\d{5}(?!\d)$/g;if(!pattern.test(zip.value) ){zipHint.innerHTML = "邮编格式不正确！";}};zip.onfocus = function(){zipHint.innerHTML = "";};//爱好验证hobby.onblur = function(){if(hobby.value.length === 0){hobbyHint.innerHTML = "不能为空！";}};hobby.onfocus = function(){hobbyHint.innerHTML = "";};//生日验证birth.onblur = function(){var pattern = /([0-9]{3}[1-9]|[0-9]{2}[1-9][0-9]{1}|[0-9]{1}[1-9][0-9]{2}|[1-9][0-9]{3})-(((0[13578]|1[02])-(0[1-9]|[12][0-9]|3[01]))|((0[469]|11)-(0[1-9]|[12][0-9]|30))|(02-(0[1-9]|[1][0-9]|2[0-8])))$/g;if(!pattern.test(birth.value) ){birthHint.innerHTML = "生日格式不正确！";}};birth.onfocus = function(){birthHint.innerHTML = "";};//政治面貌验证party.onblur = function(){if(party.value.length === 0){partyHint.innerHTML = "不能为空！";}};party.onfocus = function(){partyHint.innerHTML = "";};}//省份证ajax验证function showHint(str) {if (str.length==0) { document.getElementById("cardHint").innerHTML="";return;}xmlHttp=GetXmlHttpObject()if (xmlHttp==null) {alert ("您的浏览器不支持AJAX！");return;}var url="emp_card";url=url+"?card_code="+str;url=url+"&sid="+Math.random();xmlHttp.onreadystatechange=stateChanged;xmlHttp.open("GET",url,false);xmlHttp.send(null);}/** * 兼容所有浏览器 * @returns {___anonymous_xmlHttp} */function GetXmlHttpObject() {var xmlHttp=null;try {// Firefox, Opera 8.0+, SafarixmlHttp=new XMLHttpRequest();}catch (e) {// Internet Explorertry {xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");}catch (e) {xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");}}return xmlHttp;}function stateChanged() { if (xmlHttp.readyState==4) { document.getElementById("cardHint").innerHTML=xmlHttp.responseText;}}<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%><%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
当前位置：员工列表 > 员工添加
姓名 
身份证号 
学历 小学初中高学专科本科研究生硕士博士硕士后

 
邮箱 
联系地址 
手机 

 
电话 
所属专业 
QQ 

 
民族 
邮政编码 
爱好 

 
生日 
政治面貌 
备注 

 
职位 ${job.name}
所属部门 ${dept.name}
性别 男女

 
添加取消