学步园

1. document.onkeyup = myKeyUp;   
2.  document.onkeydown = myKeyDown;   
3.   
4.  function myKeyDown(e){   
5.     var key = window.event ? event.keyCode : e.which;   
6.    if(key==13){   
7.      var type = event.srcElement.type;   
8.      if(type!='submit' && type!='button' && type!='textarea'){   
9.        event.keyCode=9;   
10.      }   
11.    }   
12.  }   
13.   
14.  function myKeyUp(e){     
15.    obj = (window.event && event.srcElement) ? event.srcElement : e.target;   
16.    var _dataType = obj.getAttribute("dataType");   
17.    if(_dataType!=null){   
18.      var dataTypeArray = _dataType.split(",");   
19.      for(var k=0;k<dataTypeArray.length;k++){   
20.     _dataType = dataTypeArray[k];   
21.        switch(_dataType){   
22.           case "Number":   
23.           case "Double":   
24.           case "Integer":   
25.      if(obj.value=='-'){   
26.         break;   
27.      }   
28.              while(isNaN(obj.value) && obj.value.length>0){   
29.                obj.value=obj.value.substr(0, obj.value.length-1);   
30.             }   
31.             break;   
32.         }   
33.       }   
34.     }   
35.   }   
36.   
37.   
38.   function myBlur(form){   
39.      return Validator.Validate(form,2)   
40.   }   
41.   
42. Validator = {   
43. Require : /.+/,   
44. Email : /^/w+([-+.]/w+)*@/w+([-.]/w+)*/./w+([-.]/w+)*$/,   
45. Phone : /^((/(/d{3}/))|(/d{3}/-))?(/(0/d{2,3}/)|0/d{2,3}-)?[1-9]/d{6,7}$/,   
46. Mobile : /^((/(/d{3}/))|(/d{3}/-))?13/d{9}$/,   
47. Url : /^http:////[A-Za-z0-9]+/.[A-Za-z0-9]+[//=/?%/-&_~`@[/]/':+!]*([^<>/"/"])*$/,   
48. IdCard : /^/d{15}(/d{2}[A-Za-z0-9])?$/,   
49. Currency : /^/d+(/./d+)?$/,   
50. Number : /^/d+$/,   
51. Zip : /^[1-9]/d{5}$/,   
52. QQ : /^[1-9]/d{4,8}$/,   
53. Integer : /^[-/+]?/d+$/,   
54. Double : /^[-/+]?/d+(/./d+)?$/,   
55. English : /^[A-Za-z]+$/,   
56. Chinese :  /^[/u0391-/uFFE5]+$/,   
57. UnSafe : /^(([A-Z]*|[a-z]*|/d*|[-_/~!@#/$%/^&/*/./(/)/[/]/{/}<>/?/////'/"]*)|.{0,5})$|/s/,   
58. IsSafe : function(str){return !this.UnSafe.test(str);},   
59. SafeString : "this.IsSafe(value)",   
60. Limit : "this.limit(value.length,getAttribute('min'),  getAttribute('max'))",   
61. LimitB : "this.limit(this.LenB(value), getAttribute('min'), getAttribute('max'))",   
62. Date : "this.IsDate(value, getAttribute('min'), getAttribute('format'))",   
63. Repeat : "value == document.getElementsByName(getAttribute('to'))[0].value",   
64. Range : "getAttribute('min') <= Number(value) && Number(value) <= getAttribute('max')",   
65. Compare : "this.compare(value,getAttribute('operator'),getAttribute('to'))",   
66. Custom : "this.Exec(value, getAttribute('regexp'))",   
67. Group : "this.MustChecked(getAttribute('name'), getAttribute('min'), getAttribute('max'))",   
68. ErrorItem : [document.forms[0]],   
69. ErrorMessage : ["以下原因导致提交失败：/t/t/t/t"],   
70. Validate : function(theForm, mode){   
71.     var obj = theForm || event.srcElement;   
72.     var count = obj.elements.length;   
73.     this.ErrorMessage.length = 1;   
74.     this.ErrorItem.length = 1;   
75.     this.ErrorItem[0] = obj;   
76.     var dataTypeArray;   
77.     for(var i=0;i<count;i++){   
78.         with(obj.elements[i]){   
79.             var _dataType = getAttribute("dataType");   
80.             if(typeof(_dataType) == "object") continue; // || typeof(this[_dataType]) == "undefined")  continue;   
81.             this.ClearState(obj.elements[i]);   
82.             if(getAttribute("require") == "false" && value == "") continue;   
83.             dataTypeArray = _dataType.split(",");   
84.             var lastid=-1;   
85.             for(var k=0;k<dataTypeArray.length;k++){   
86.               _dataType = dataTypeArray[k];   
87.               if(this[_dataType]==null){   
88.                 alert("???????????:"+_dataType);   
89.                 return false;   
90.               }   
91.               switch(_dataType){   
92.                 case "Date" :   
93.                 case "Repeat" :   
94.                 case "Range" :   
95.                 case "Compare" :   
96.                 case "Custom" :   
97.                 case "Group" :   
98.                 case "Limit" :   
99.                 case "LimitB" :   
100.                 case "SafeString" :   
101.                     if(!eval(this[_dataType]))  {   
102.                         if(lastid==-1){   
103.                           this.AddError(i, getAttribute("msg"));   
104.                           lastid=i;   
105.                         }   
106.                     }   
107.                     break;   
108.                 default :   
109.                     if(!this[_dataType].test(value)){   
110.                         if(lastid==-1){   
111.                             this.AddError(i, getAttribute("msg"));   
112.                             lastid=i;   
113.                         }   
114.                     }   
115.                     break;   
116.               }   
117.             }   
118.         }   
119.     }   
120.     if(this.ErrorMessage.length > 1){   
121.         mode = mode || 1;   
122.         var errCount = this.ErrorItem.length;   
123.         switch(mode){   
124.         case 2 :   
125.             for(var i=1;i<errCount;i++)   
126.                 this.ErrorItem[i].style.color = "red";   
127.         case 1 :   
128.             alert(this.ErrorMessage.join("/n"));   
129.             this.ErrorItem[1].focus();   
130.             break;   
131.         case 3 :   
132.             for(var i=1;i<errCount;i++){   
133.             try{   
134.                 var span = document.createElement("SPAN");   
135.                 span.id = "__ErrorMessagePanel";   
136.                 span.style.color = "red";   
137.                 this.ErrorItem[i].parentNode.appendChild(span);   
138.                 span.innerHTML = this.ErrorMessage[i].replace(//d+:/,"*");   
139.                 }   
140.                 catch(e){alert(e.description);}   
141.             }   
142.             this.ErrorItem[1].focus();   
143.             break;   
144.         default :   
145.             alert(this.ErrorMessage.join("/n"));   
146.             break;   
147.         }   
148.         return false;   
149.     }   
150.     return true;   
151. },   
152. limit : function(len,min, max){   
153.     min = min || 0;   
154.     max = max || Number.MAX_VALUE;   
155.     return min <= len && len <= max;   
156. },   
157. LenB : function(str){   
158.     return str.replace(/[^/x00-/xff]/g,"**").length;   
159. },   
160. ClearState : function(elem){   
161.     with(elem){   
162.         if(style.color == "red")   
163.             style.color = "";   
164.         var lastNode = parentNode.childNodes[parentNode.childNodes.length-1];   
165.         if(lastNode.id == "__ErrorMessagePanel")   
166.             parentNode.removeChild(lastNode);   
167.     }   
168. },   
169. AddError : function(index, str){   
170.     this.ErrorItem[this.ErrorItem.length] = this.ErrorItem[0].elements[index];   
171.     this.ErrorMessage[this.ErrorMessage.length] = this.ErrorMessage.length + ":" + str;   
172. },   
173. Exec : function(op, reg){   
174.     return new RegExp(reg,"g").test(op);   
175. },   
176. compare : function(op1,operator,op2){   
177.   op2 = eval(op2);   
178.   if(!isNaN(op1) && !isNaN(op2)){   
179.     op1 = Number(op1);   
180.     op2 = Number(op2);   
181.   }   
182.     switch (operator) {   
183.         case "NotEqual":   
184.             return (op1 != op2);   
185.         case "GreaterThan":   
186.             return (op1 > op2);   
187.         case "GreaterThanEqual":   
188.             return (op1 >= op2);   
189.         case "LessThan":   
190.             return (op1 < op2);   
191.         case "LessThanEqual":   
192.             return (op1 <= op2);   
193.         default:   
194.             return (op1 == op2);   
195.     }   
196. },   
197. MustChecked : function(name, min, max){   
198.     var groups = document.getElementsByName(name);   
199.     var hasChecked = 0;   
200.     min = min || 1;   
201.     max = max || groups.length;   
202.     for(var i=groups.length-1;i>=0;i--)   
203.         if(groups[i].checked) hasChecked++;   
204.     return min <= hasChecked && hasChecked <= max;   
205. },   
206. IsDate : function(op, formatString){   
207.     formatString = formatString || "ymd";   
208.     var m, year, month, day;   
209.     switch(formatString){   
210.         case "ymd" :   
211.             m = op.match(new RegExp("^((//d{4})|(//d{2}))([-./])(//d{1,2})//4(//d{1,2})$"));   
212.             if(m == null ) return false;   
213.             day = m[6];   
214.             month = m[5]--;   
215.             year =  (m[2].length == 4) ? m[2] : GetFullYear(parseInt(m[3], 10));   
216.             break;   
217.         case "dmy" :   
218.             m = op.match(new RegExp("^(//d{1,2})([-./])(//d{1,2})//2((//d{4})|(//d{2}))$"));   
219.             if(m == null ) return false;   
220.             day = m[1];   
221.             month = m[3]--;   
222.             year = (m[5].length == 4) ? m[5] : GetFullYear(parseInt(m[6], 10));   
223.             break;   
224.         default :   
225.             break;   
226.     }   
227.     if(!parseInt(month)) return false;   
228.     month = month==12 ?0:month;   
229.     var date = new Date(year, month, day);   
230.        return (typeof(date) == "object" && year == date.getFullYear() && month == date.getMonth() && day == date.getDate());   
231.     function GetFullYear(y){return ((y<30 ? "20" : "19") + y)|0;}   
232. }   
233. }  

  document.onkeyup = myKeyUp;
  document.onkeydown = myKeyDown;

  function myKeyDown(e){
  	var key = window.event ? event.keyCode : e.which;
    if(key==13){
      var type = event.srcElement.type;
      if(type!='submit' && type!='button' && type!='textarea'){
        event.keyCode=9;
      }
    }
  }

  function myKeyUp(e){  
    obj = (window.event && event.srcElement) ? event.srcElement : e.target;
    var _dataType = obj.getAttribute("dataType");
    if(_dataType!=null){
      var dataTypeArray = _dataType.split(",");
      for(var k=0;k<dataTypeArray.length;k++){
	    _dataType = dataTypeArray[k];
        switch(_dataType){
           case "Number":
           case "Double":
           case "Integer":
		 if(obj.value=='-'){
			break;
		 }
           	 while(isNaN(obj.value) && obj.value.length>0){
         	   obj.value=obj.value.substr(0, obj.value.length-1);
         	}
         	break;
         }
       }
     }
   }


   function myBlur(form){
      return Validator.Validate(form,2)
   }

 Validator = {
	Require : /.+/,
	Email : /^/w+([-+.]/w+)*@/w+([-.]/w+)*/./w+([-.]/w+)*$/,
	Phone : /^((/(/d{3}/))|(/d{3}/-))?(/(0/d{2,3}/)|0/d{2,3}-)?[1-9]/d{6,7}$/,
	Mobile : /^((/(/d{3}/))|(/d{3}/-))?13/d{9}$/,
	Url : /^http:////[A-Za-z0-9]+/.[A-Za-z0-9]+[//=/?%/-&_~`@[/]/':+!]*([^<>/"/"])*$/,
	IdCard : /^/d{15}(/d{2}[A-Za-z0-9])?$/,
	Currency : /^/d+(/./d+)?$/,
	Number : /^/d+$/,
	Zip : /^[1-9]/d{5}$/,
	QQ : /^[1-9]/d{4,8}$/,
	Integer : /^[-/+]?/d+$/,
	Double : /^[-/+]?/d+(/./d+)?$/,
	English : /^[A-Za-z]+$/,
	Chinese :  /^[/u0391-/uFFE5]+$/,
	UnSafe : /^(([A-Z]*|[a-z]*|/d*|[-_/~!@#/$%/^&/*/./(/)/[/]/{/}<>/?/////'/"]*)|.{0,5})$|/s/,
	IsSafe : function(str){return !this.UnSafe.test(str);},
	SafeString : "this.IsSafe(value)",
	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('min') <= Number(value) && Number(value) <= getAttribute('max')",
	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]],
	ErrorMessage : ["以下原因导致提交失败：/t/t/t/t"],
	Validate : function(theForm, mode){
		var obj = theForm || event.srcElement;
		var count = obj.elements.length;
		this.ErrorMessage.length = 1;
		this.ErrorItem.length = 1;
		this.ErrorItem[0] = obj;
		var dataTypeArray;
		for(var i=0;i<count;i++){
			with(obj.elements[i]){
				var _dataType = getAttribute("dataType");
				if(typeof(_dataType) == "object") continue; // || typeof(this[_dataType]) == "undefined")  continue;
				this.ClearState(obj.elements[i]);
				if(getAttribute("require") == "false" && value == "") continue;
				dataTypeArray = _dataType.split(",");
				var lastid=-1;
				for(var k=0;k<dataTypeArray.length;k++){
				  _dataType = dataTypeArray[k];
				  if(this[_dataType]==null){
				  	alert("???????????:"+_dataType);
				  	return false;
				  }
				  switch(_dataType){
					case "Date" :
					case "Repeat" :
					case "Range" :
					case "Compare" :
					case "Custom" :
					case "Group" :
					case "Limit" :
					case "LimitB" :
					case "SafeString" :
						if(!eval(this[_dataType]))	{
							if(lastid==-1){
							  this.AddError(i, getAttribute("msg"));
							  lastid=i;
							}
						}
						break;
					default :
						if(!this[_dataType].test(value)){
						    if(lastid==-1){
							    this.AddError(i, getAttribute("msg"));
							    lastid=i;
							}
						}
						break;
				  }
				}
			}
		}
		if(this.ErrorMessage.length > 1){
			mode = mode || 1;
			var errCount = this.ErrorItem.length;
			switch(mode){
			case 2 :
				for(var i=1;i<errCount;i++)
					this.ErrorItem[i].style.color = "red";
			case 1 :
				alert(this.ErrorMessage.join("/n"));
				this.ErrorItem[1].focus();
				break;
			case 3 :
				for(var i=1;i<errCount;i++){
				try{
					var span = document.createElement("SPAN");
					span.id = "__ErrorMessagePanel";
					span.style.color = "red";
					this.ErrorItem[i].parentNode.appendChild(span);
					span.innerHTML = this.ErrorMessage[i].replace(//d+:/,"*");
					}
					catch(e){alert(e.description);}
				}
				this.ErrorItem[1].focus();
				break;
			default :
				alert(this.ErrorMessage.join("/n"));
				break;
			}
			return false;
		}
		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){
			if(style.color == "red")
				style.color = "";
			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] = this.ErrorMessage.length + ":" + str;
	},
	Exec : function(op, reg){
		return new RegExp(reg,"g").test(op);
	},
	compare : function(op1,operator,op2){
	  op2 = eval(op2);
	  if(!isNaN(op1) && !isNaN(op2)){
	  	op1 = Number(op1);
	  	op2 = Number(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;
	},
	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]--;
				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]--;
				year = (m[5].length == 4) ? m[5] : GetFullYear(parseInt(m[6], 10));
				break;
			default :
				break;
		}
		if(!parseInt(month)) return false;
		month = month==12 ?0:month;
		var date = new Date(year, month, day);
        return (typeof(date) == "object" && year == date.getFullYear() && month == date.getMonth() && day == date.getDate());
		function GetFullYear(y){return ((y<30 ? "20" : "19") + y)|0;}
	}
 }

简单的例子

1. <form method="post" id="MAIN_FORM" onSubmit="return Validator.Validate(this,3)">  
2. <input type="text" name="name" dataType="Require" msg="名称必须填写"/>  
3. </form>