当前位置: 代码迷 >> JavaScript >> js证验框架
  详细解决方案

js证验框架

热度:280   发布时间:2013-01-26 13:47:02.0
js验证框架

一个同事写的,分享给大家:

////注:用此验证框架,如要确保页面输入框的边框架样式好看。最好写个通用输入框样式如:input[type="text"] {border:solid 2px #f50;}
Validator = {
	Require : /\s*\S+\s*/,
	RemarkLength : /^\s*\S{0,500}\s*$/,
	RegExpValidate:"this.RegExpValidate(value,accessKey)",
	TextLength : "this.CheckTextLength(value,accessKey)",
	Email : /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/,
	EmailOrNull : /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/,
	Birthday : /^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/,
	BirthdayOrNull : /^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/, 
	Phone : /(^[0-9]{3,4}\-[0-9]{3,8}$)|(^\([0-9]{3,4}\)[0-9]{3,8}$)|(^0{0,1}13[0-9]{9}$)/,
	PhoneOrNull : /(^[0-9]{3,4}\-[0-9]{3,8}$)|(^\([0-9]{3,4}\)[0-9]{3,8}$)|(^0{0,1}13[0-9]{9}$)/,
	LocalPhone : /(^[0-9]{3,8}$)|(^\([0-9]{3,4}\)[0-9]{3,8}$)|(^0{0,1}13[0-9]{9}$)/,
	LocalPhoneOrNull : /(^[0-9]{3,8}$)|(^\([0-9]{3,4}\)[0-9]{3,8}$)|(^0{0,1}13[0-9]{9}$)/,
	Mobile : /^1(3[0-9]|8[5-9]|5[01256789])\d{8}$/,
	MobileOrNull : /^1(3[0-9]|8[5-9]|5[01256789])\d{8}$/,
	Url : /^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/,
	UrlOrNull : /^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/,
	IdCard : "this.IsIdCard(value)",
	IdCardOrNull : "this.IsIdCard(value)",
	Currency : /^\d+(\.\d+)?$/,
	Number : /^\d+$/,
	NumberOrNull : /^\d*$/,
	Zip : /^[1-9]\d{5}$/,
	ZipOrNull : /^[1-9]\d{5}$/,
	QQ : /^[1-9]\d{4,15}$/,
	QQOrNull : /^[1-9]\d{4,15}$/,
	Integer : /^[-\+]?\d+$/,
	IntegerAndNotMinus : /^[+]?\d+$/,   //非负整数
	IntegerOrNullAndNotMinus : /^[+]?\d*$/,   //可以是空或者非负整数
	IntegerOrNull : /^[-\+]?\d*$/,  //可以是空或者必须是整数
	Double : /^[-\+]?\d+(\.\d+)?$/,
	DoubleAndNotMinus : /^[+]?\d+(\.\d+)?$/,   //非负整数、小数
	DoubleOrNull : /^[-\+]?\d*(\.\d+)*$/,  // 可以是空或者必须是整数、小数
	English : /^[A-Za-z]+$/,
	EnglishOrNull : /^[A-Za-z]*$/,
	BigWord : /^[A-Z]+$/,
	BigWordOrNull : /^[A-Z]*$/,
	Chinese : /^[\u0391-\uFFE5]+$/,
	ChineseOrNull : /^[\u0391-\uFFE5]*$/,
	UnChinese : /^\w+$/,// 必填,由数字、26个英文字母或者下划线组成的字符串
	UnChineseOrNull : /^\w*$/,// 必填,由数字、26个英文字母或者下划线组成的字符串
	JpgImage : /(.jpg)$/, //用于验证图片扩展名的正则表达式(.jpg|.png|.gif|.ps|.jpeg)
	xlsFile : /(.xls)$/, 
	Username : /^[a-z]\w{3,}$/i,
	UnSafe : /^(([A-Z]*|[a-z]*|\d*|[-_\~!@#\$%\^&\*\.\(\)\[\]\{\}<>\?\\\/\'\"]*)|.{0,5})$|\s/,
	Year : /^[0-9]\d{3}$/,
	Month : "this.IsMonth(value)",
	IsSafe : function(str) {
		return !this.UnSafe.test(str);
	},
	SafeString : "this.IsSafe(value)",
	Filter : "this.DoFilter(value, getAttribute('accept'))",
	Limit : "this.limit(value.length,getAttribute('min'),  getAttribute('max'))",
	LimitB : "this.limit(this.LenB(value), getAttribute('min'), getAttribute('max'))",
	Date : "this.IsDate(value, getAttribute('min'), getAttribute('format'))",
	Repeat : "value == document.getElementsByName(getAttribute('to'))[0].value",
	Range : "getAttribute('accesskey').split(',')[0] <= (value|0) && (value|0) <= getAttribute('accesskey').split(',')[1]",
	Compare : "this.compare(value,getAttribute('operator'),getAttribute('to'))",
	Custom : "this.Exec(value, getAttribute('regexp'))",
	Group : "this.MustChecked(getAttribute('name'), getAttribute('min'), getAttribute('max'))",
	ErrorItem : [document.forms[0]],
	CellValidator : "cellCheck(value,getAttribute('index'))",
	ErrorMessage : [""],
	
	//错误消息元素后缀
	ErrorMsg : "ErrorMsg",
	//系统默认边框颜色
	DefaultColor : "#00A8E6",
	//输入错误边框颜色
	ErrorColor : "#FF3300",
	//输入正确边框颜色
	RightColor : "#00CC00",
	
	/** 消息占位符 **/
	replaceOne : "",
	replaceTwo : "",
	replaceThree : "",
	
	Validate : function(theForm) {
		var obj = theForm || event.srcElement;
		var count = obj.elements.length;
		this.ErrorMessage.length = 1;
		this.ErrorItem.length = 1;
		this.ErrorItem[0] = obj;
		
		for (var i = 0; i < count; i++) {
			with (obj.elements[i]) {
				var _dataClass = getAttribute("alt");
				if (typeof(_dataClass) == "object"
						|| typeof(this[_dataClass]) == "undefined"){
					continue;
				}
				this.ClearState(obj.elements[i]);
				
				var titleValue = getAttribute("title");
				
				if(titleValue == ""){
					titleValue = MessageSource[_dataClass];
					//如果找不到当前验证的错误消息,使用共用错误消息
					if(titleValue  == undefined || titleValue == ""){
						titleValue = MessageSource["DefaultMsg"];
					}
				}
				//可以为空验证
				if(_dataClass == "BirthdayOrNull" || _dataClass == "JpgImage"  || _dataClass == "EmailOrNull"
					 || _dataClass == "BirthdayOrNull"  || _dataClass == "PhoneOrNull"  || _dataClass == "LocalPhoneOrNull"
					  || _dataClass == "MobileOrNull"  || _dataClass == "UrlOrNull" || _dataClass ==  "ZipOrNull"
					   || _dataClass == "QQOrNull" || _dataClass == "QQOrNull"){
					if(value != ""){
							if (!this[_dataClass].test(value)) {
								this.AddError(i, titleValue);
							}
					}
				}else if(_dataClass == "IdCardOrNull"){
					if(value != null){
						if (!eval(this[_dataClass])) {
							this.AddError(i, titleValue);
						}
					}
				}else if( _dataClass == "Month"){
					if (!eval(this[_dataClass])) {
						this.AddError(i, titleValue);
					}
				}else{
					var objj = this[_dataClass];
					if(objj){
						if (objj.test&&!objj.test(value)) {
							this.AddError(i, titleValue);
						}else if (!eval(objj)) {
							if(getAttribute("title") == ""){
								titleValue = titleValue.replace("%s1",this.replaceOne);
								titleValue = titleValue.replace("%s2",this.replaceTwo);
								titleValue = titleValue.replace("%s3",this.replaceThree);
							}
							this.AddError(i, titleValue);
						}
					}
				}
			}
		}

		if (this.ErrorMessage.length > 1) {
			var errCount = this.ErrorItem.length;
			for(var i=1;i<errCount;i++){
				this.ErrorItem[i].style.border = "1px solid " + this.ErrorColor;
				var err = document.getElementById(this.ErrorItem[i].getAttribute("name") + this.ErrorMsg);
				if(err != null){
					err.style.color = this.ErrorColor;
					err.innerHTML = this.ErrorMessage[i];
				}
			}
			return false;
		}
		//清除替换消息
		CleanReplace();
		return true;
	},
	limit : function(len, min, max) {
		min = min || 0;
		max = max || Number.MAX_VALUE;
		return min <= len && len <= max;
	},
	LenB : function(str) {
		return str.replace(/[^\x00-\xff]/g, "**").length;
	},
	ClearState : function(elem) {
		with (elem) {
			var borColor = "1px solid  ";
			var err = document.getElementById(getAttribute("name") + this.ErrorMsg);
			if(value == ""){
				//可以为空的表单数据,不输入内容边框为系统默认颜色
				borColor +=  this.DefaultColor;
				if(err != null){
					err.style.color = this.DefaultColor;
					err.innerHTML = "";
					
				}
			}else{
				borColor +=  this.RightColor;
				if(err != null){
					err.style.color = this.RightColor;
					err.innerHTML = "输入正确!";
					
				}
			}
			style.border = borColor;
			var lastNode = parentNode.childNodes[parentNode.childNodes.length
					- 1];
			if (lastNode.id == "__ErrorMessagePanel")
				parentNode.removeChild(lastNode);
		}
	},
	AddError : function(index, str) {
		this.ErrorItem[this.ErrorItem.length] = this.ErrorItem[0].elements[index];
		this.ErrorMessage[this.ErrorMessage.length] = str;
	},
	Exec : function(op, reg) {
		return new RegExp(reg, "g").test(op);
	},
	compare : function(op1, operator, op2) {
		switch (operator) {
			case "NotEqual" :
				return (op1 != op2);
			case "GreaterThan" :
				return (op1 > op2);
			case "GreaterThanEqual" :
				return (op1 >= op2);
			case "LessThan" :
				return (op1 < op2);
			case "LessThanEqual" :
				return (op1 <= op2);
			default :
				return (op1 == op2);
		}
	},
	MustChecked : function(name, min, max) {
		var groups = document.getElementsByName(name);
		var hasChecked = 0;
		min = min || 1;
		max = max || groups.length;
		for (var i = groups.length - 1; i >= 0; i--)
			if (groups[i].checked)
				hasChecked++;
		return min <= hasChecked && hasChecked <= max;
	},
	DoFilter : function(input, filter) {
		return new RegExp("^.+\.(?=EXT)(EXT)$".replace(/EXT/g, filter
				.split(/\s*,\s*/).join("|")), "gi").test(input);
	},
	IsMonth : function(str) {
		if (parseInt(str) <= 12)
			return true;
		else
			return false;
	},
	IsIdCard : function(number) {
		var date, Ai;
		var verify = "10x98765432";
		var Wi = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
		var area = ['', '', '', '', '', '', '', '', '', '', '', '??', '??',
				'??', '??', '???', '', '', '', '', '', '??', '??', '???', '',
				'', '', '', '', '', '', '??', '??', '??', '??', '??', '??',
				'??', '', '', '', '??', '??', '??', '??', '??', '??', '', '',
				'', '??', '??', '??', '??', '??', '', '', '', '', '', '', '??',
				'??', '??', '??', '??', '', '', '', '', '', '??', '', '', '',
				'', '', '', '', '', '', '??', '??', '', '', '', '', '', '', '',
				'', '??'];
		var re = number
				.match(/^(\d{2})\d{4}(((\d{2})(\d{2})(\d{2})(\d{3}))|((\d{4})(\d{2})(\d{2})(\d{3}[x\d])))$/i);
		if (re == null)
			return false;
		if (re[1] >= area.length || area[re[1]] == "")
			return false;
		if (re[2].length == 12) {
			Ai = number.substr(0, 17);
			date = [re[9], re[10], re[11]].join("-");
		} else {
			Ai = number.substr(0, 6) + "19" + number.substr(6);
			date = ["19" + re[4], re[5], re[6]].join("-");
		}
		if (!this.IsDate(date, "ymd"))
			return false;
		var sum = 0;
		for (var i = 0; i <= 16; i++) {
			sum += Ai.charAt(i) * Wi[i];
		}
		Ai += verify.charAt(sum % 11);
		return (number.length == 15 || number.length == 18 && number == Ai);
	},
	CheckTextLength : function(val,accessKey){
		var min = "0";
		var max = "500";
		if(accessKey != ""){
			var keyArray = accessKey.split(",");
			min = keyArray[0];
			max = keyArray[1];
		}
		var reg = new RegExp("^\\s*\\S{" + min + "," + max + "}\\s*$");
		this.replaceOne = min;
		this.replaceTwo = max;
		//alert(reg + "test()" + val + " ="  + reg.test(val));
		return reg.test(val);
	},
	RegExpValidate : function(val,accessKey){
		if(accessKey != ""){
			var reg = new RegExp("^" + accessKey + "$");
			return reg.test(val);
		}else{
			return false;
		}
	},
	IsDate : function(op, formatString) {
		formatString = formatString || "ymd";
		var m, year, month, day;
		switch (formatString) {
			case "ymd" :
				m = op
						.match(new RegExp("^((\\d{4})|(\\d{2}))([-./])(\\d{1,2})\\4(\\d{1,2})$"));
				if (m == null)
					return false;
				day = m[6];
				month = m[5] * 1;
				year = (m[2].length == 4) ? m[2] : GetFullYear(parseInt(m[3],
						10));
				break;
			case "dmy" :
				m = op
						.match(new RegExp("^(\\d{1,2})([-./])(\\d{1,2})\\2((\\d{4})|(\\d{2}))$"));
				if (m == null)
					return false;
				day = m[1];
				month = m[3] * 1;
				year = (m[5].length == 4) ? m[5] : GetFullYear(parseInt(m[6],
						10));
				break;
			default :
				break;
		}
		if (!parseInt(month))
			return false;
		month = month == 0 ? 12 : month;
		var date = new Date(year, month - 1, day);
		return (typeof(date) == "object" && year == date.getFullYear()
				&& month == (date.getMonth() + 1) && day == date.getDate());
		function GetFullYear(y) {
			return ((y < 30 ? "20" : "19") + y) | 0;
		}
	},
	CleanReplace : function() {
		this.replaceOne = "";
		this.replaceTwo = "";
		this.replaceThree = "";
	}
}
MessageSource = {
	DefaultMsg : "请输入有效值.",
	Require : "请输入值.",
	RemarkLength : "备注长度必须为0-500个字符.",
	TextLength : "输入值的长度应该在 %s1 至 %s2 之间.",
	Email : "请输入正确的邮箱(Email).",
	EmailOrNull : "请输入正确的邮箱(Email).",
	Birthday : "请输入正确的生日.",
	BirthdayOrNull : "请输入正确的生日.", 
	Phone : "请输入正确的电话号码,如010-29898989.",
	PhoneOrNull : "请输入正确的电话号码,如010-29898989.",
	LocalPhone : "请输入正确的电话号码,如010-29898989.",
	LocalPhoneOrNull : "请输入正确的电话号码,如010-29898989.",
	Mobile : "请输入正确的手机号码.",
	MobileOrNull : "请输入正确的手机号码.",
	Url : "请输入正确的链接(URL).",
	UrlOrNull : "请输入正确的链接(URL).",
	IdCard : "请输入正确的身份证号码.",
	IdCardOrNull : "请输入正确的身份证号码.",
	Currency : "请输入正确的值.",
	Number : "请输入正确的数字.",
	NumberOrNull : "请输入正确的数字.",
	Zip : "请输入正确的邮政编码.",
	ZipOrNull : "请输入正确的邮政编码.",
	QQ : "请输入正确的QQ号码.",
	QQOrNull : "请输入正确的QQ号码.",
	Integer : "请输入正确的整数.",
	IntegerAndNotMinus : "请输入大于0的整数.",   //非负整数
	IntegerOrNullAndNotMinus : "请输入大于0的整数.",   //可以是空或者非负整数
	IntegerOrNull : "请输入正确的整数.",  //可以是空或者必须是整数
	Double : "请输入正确的整数或小数.",
	DoubleAndNotMinus : "请输入大于0的整数或小数.",   //非负整数、小数
	DoubleOrNull : "请输入正确的整数或小数.",  // 可以是空或者必须是整数、小数
	English : "请输入正确的字母.",
	EnglishOrNull : "请输入正确的字母.",
	BigWord : "请输入正确的大写字母.",
	BigWordOrNull : "请输入正确的大写字母.",
	Chinese : "请输入正确的汉字.",
	ChineseOrNull : "请输入正确的汉字.",
	UnChinese : "请输入正确的由数字、26个英文字母或者下划线组成的字符.",// 必填,由数字、26个英文字母或者下划线组成的字符串
	UnChineseOrNull : "请输入正确的由数字、26个英文字母或者下划线组成的字符.",// 必填,由数字、26个英文字母或者下划线组成的字符串
	JpgImage : "图片格式不正确.", //用于验证图片扩展名的正则表达式(.jpg|.png|.gif|.ps|.jpeg)
	xlsFile : "文件格式不正确.", 
	Username : "请输入正确有用户名.",
	UnSafe : "请输入正确的值.",
	Year : "请输入正确的年份.",
	Month : "请输入正确的月份."
}

?

  相关解决方案