此验证类实现对数字、整数、小数、日期、电子邮件等进行验证。同时为以后需要添加验证功能提供扩展。 <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <SCRIPT LANGUAGE="JavaScript"> <!-- function Validate(){ //ids保存验证的id,可多值,用逗号","隔开 //统一验证类型是否都为空。可供外部调用 Validate.prototype.isEmptys=function( ids ){ var arrIds = []; if(ids.indexOf(",")!=-1) //判断是否有,分隔符 arrIds = ids.split( "," ); else arrIds[0]=ids; var i = 0; var strValue; for(i=0;i<arrIds.length;i++){ strValue=document.getElementById(arrIds[i]).value; if(isEmpty( strValue )){ document.getElementById(arrIds[i]).focus(); return true; } } return false; } //统一验证类型是否都为整数。可供外部调用 Validate.prototype.isInts=function( ids ){ var arrIds = []; if(ids.indexOf(",")!=-1) //判断是否有,分隔符 arrIds = ids.split( "," ); else arrIds[0]=ids; var i = 0; var strValue; for(i=0;i<arrIds.length;i++){ strValue=document.getElementById(arrIds[i]).value; if(isInt( strValue )){ document.getElementById(arrIds[i]).focus(); return true; } } return false; } //统一验证类型是否都为数字。可供外部调用 Validate.prototype.isNumerics=function( ids ){ var arrIds = []; if(ids.indexOf(",")!=-1) //判断是否有,分隔符 arrIds = ids.split( "," ); else arrIds[0]=ids; var i = 0; var strValue; for(i=0;i<arrIds.length;i++){ strValue=document.getElementById(arrIds[i]).value; if(isNumeric( strValue )){ document.getElementById(arrIds[i]).focus(); return true; } } return false; } //统一验证类型是否都为小数。可供外部调用 Validate.prototype.isFloats=function( ids ){ var arrIds = []; if(ids.indexOf(",")!=-1) //判断是否有,分隔符 arrIds = ids.split( "," ); else arrIds[0]=ids; var i = 0; var strValue; for(i=0;i<arrIds.length;i++){ strValue=document.getElementById(arrIds[i]).value; if(isFloat( strValue )){ document.getElementById(arrIds[i]).focus(); return true; } } return false; } //统一验证类型是否都为日期。可供外部调用 Validate.prototype.isDates=function( ids ){ var arrIds = []; if(ids.indexOf(",")!=-1) //判断是否有,分隔符 arrIds = ids.split( "," ); else arrIds[0]=ids; var i = 0; var strValue; for(i=0;i<arrIds.length;i++){ strValue=document.getElementById(arrIds[i]).value; if(isDate( strValue )){ document.getElementById(arrIds[i]).focus(); return true; } } return false; } //统一验证类型是否都为电子邮件。可供外部调用 Validate.prototype.isEmails=function( ids ){ var arrIds = []; if(ids.indexOf(",")!=-1) //判断是否有,分隔符 arrIds = ids.split( "," ); else arrIds[0]=ids; var i = 0; var strValue; for(i=0;i<arrIds.length;i++){ strValue=document.getElementById(arrIds[i]).value; if(isEmail( strValue )){ document.getElementById(arrIds[i]).focus(); return true; } } return false; } /** *以下为内部使用的函数,不提供外部调用 */ //正则表达式验证match方法, re 参数最后以 g 结尾。 function checkExp( re, s ){ return s.match(re)!=null; } // 验证是否 整数 function isInt( strValue ){ return checkExp( /^\d*$/g, strValue ); } // 验证是否 数字 function isNumeric( strValue ){ return !isNaN(strValue); //isNaN判断参数值是否是一个数字,若不是数字则返回true } // 验证是否 小数 function isFloat( strValue ){ return checkExp(/^[0-9]+\.[0-9]+$/g, strValue ); } // 验证是否 电子邮件 function isEmail( strValue ){ return checkExp(/^[a-zA-Z]+[a-zA-Z0-9_]*@[a-zA-Z0-9]+\.[a-zA-Z0-9]+$/g, strValue ); } // 验证是否 为空 function isEmpty( strValue ) { if( strValue == "" ) return true; else return false; } //验证是否 日期 function isDate( strValue ){ // 日期格式必须是 2001-10-1/2001-1-10 或者为空 if( isEmpty( strValue ) ) return true; if( !checkExp( /^\d{4}-[01]?\d-[0-3]?\d$/g, strValue ) ) return false; // 或者 /^\d{4}-[1-12]-[1-31]\d$/ var arr = strValue.split( "-" ); var year = arr[0]; var month = arr[1]; var day = arr[2]; // 1 <= 月份 <= 12,1 <= 日期 <= 31 if( !( ( 1<= month ) && ( 12 >= month ) && ( 31 >= day ) && ( 1 <= day ) ) ) return false; // 润年检查 if( !( ( year % 4 ) == 0 ) && ( month == 2) && ( day == 29 ) ) return false; // 7月以前的双月每月不超过30天 if( ( month <= 7 ) && ( ( month % 2 ) == 0 ) && ( day >= 31 ) ) return false; // 8月以后的单月每月不超过30天 if( ( month >= 8) && ( ( month % 2 ) == 1) && ( day >= 31 ) ) return false; // 2月最多29天 if( ( month == 2) && ( day >=30 ) ) return false; return true; } } //--> </SCRIPT> <SCRIPT LANGUAGE="JavaScript"> <!-- //测试 var vl=new Validate(); function v(){ if (vl.isEmptys("id,name,password1,password2")) { alert("id,name,password1,password2不能为空。"); return false; }else if (!vl.isEmptys("email") && !vl.isEmails("email")) { alert("email格式不正确。"); return false; }else if (!vl.isEmptys("money") && !vl.isFloats("money")) { alert("金额至少有一位小数。"); return false; }else if (!vl.isEmptys("phone") && !vl.isNumerics("phone")) { alert("电话号码必须为数字。"); return false; }else if (!vl.isEmptys("birthday") && !vl.isDates("birthday")) { alert("出生日期格式为:1980-12-12。"); return false; }else if (document.getElementById("password1").value!=document.getElementById("password2").value) { alert("两次输入的密码必须相同。"); return false; }else { alert("全部验证正确。"); return true; } } //--> </SCRIPT> </HEAD> <BODY align="left"> <FORM method="post" action="" onSubmit="return v();" target="_blank"> 帐 号*:<INPUT TYPE="text" ID="id">(不能为空)<BR> 名 字*:<INPUT TYPE="text" ID="name">(不能为空)<BR> 密 码*:<INPUT TYPE="password" ID="password1">(不能为空)<BR> 确认密码:<INPUT TYPE="password" ID="password2">(不能为空)<BR> 出生日期:<INPUT TYPE="text" ID="birthday">(格式为:1980-12-12)<BR> 金 额:<INPUT TYPE="text" ID="money">(至少有一位小数,允许为空)<BR> 电子邮件:<INPUT TYPE="text" ID="email">(格式为XX@XX.XX,允许为空)<BR> 电话号码:<INPUT TYPE="text" ID="phone">(数字号码,允许为空)<BR> <CENTER><INPUT TYPE="submit" value="统一验证"></CENTER> </FORM> </BODY> </HTML> |
|
来自: 小朋 > 《Html/CSS/Javascript》