自己写的一个JavaScrpt输入验证

公司的管理很乱,也没有输入的脚本验证调用,自己就小试身手自己写了一个js的输入验证,下面是程序的主题,可以直接放在ASP页面中,也可以放在头文件中。

  
  
  
  
  1. <script language="javascript">  
  2. //js验证  
  3.  
  4.   function toDateFromString(strDate){    
  5.    if(strDate.length!=8){        
  6.    return   0;    
  7.    }    
  8.     var dtDate =1;    
  9.     var nYear=parseInt(strDate.substring(0,4),10);    
  10.     var nMonth =parseInt(strDate.substring(4,6 ),10);    
  11.     var nDay =   parseInt(strDate.substring(6,8),10);    
  12.     if( isNaN(nYear)==true||isNaN(nMonth)==true||isNaN(nDay)==true){    
  13.     return 0;    
  14.     }    
  15.     dtDate =new  Date(nYear,nMonth-1,nDay);    
  16.     if(nYear!=dtDate.getFullYear()||(nMonth-1)!=dtDate.getMonth()||nDay!=dtDate.getDate()){    
  17.    return 0;    
  18.     }    
  19.    return 1;    
  20.     }    
  21.     
  22.     function checkMonthFromString(strMonth){    
  23.    if(strMonth.length!=6){        
  24.    return   0;    
  25.    }    
  26.     var dtDate =1;    
  27.     var nYear=parseInt(strMonth.substring(0,4),10);    
  28.     var nMonth =parseInt(strMonth.substring(4,6 ),10);    
  29.     var nDay =   parseInt("01");    
  30.     if( isNaN(nYear)==true||isNaN(nMonth)==true||isNaN(nDay) ==true){    
  31.    return 0;    
  32.     }    
  33.     dtDate =new Date(nYear,nMonth-1,nDay);    
  34.     if(nYear!=dtDate.getFullYear()||(nMonth-1)!=dtDate.getMonth()||nDay!=dtDate.getDate()){    
  35.    return 0   ;    
  36.     }    
  37.     return 1;    
  38.    }    
  39.    
  40. function inputJsCheck(object,checkType,showObject){  
  41.  //默认为正确  
  42.  switch   (checkType)   {    
  43.         case   "Int":    
  44.   //整数验证  
  45.  
  46.    var patrn=/^[0-9]+$/;  
  47.    if (!patrn.test(object.value)){   
  48.     showObject.innerHTML="<font color='#FF0000'>*输入整数</font>" 
  49.     object.setAttribute("isCheck","0");  
  50.    }else{   
  51.     showObject.innerHTML="<font color='#009900'>*正确</font>" 
  52.     object.setAttribute("isCheck","1");  
  53.    }  
  54.    return ;   
  55.         case   "Money":  
  56.   //价格验证   
  57.    
  58.    var patrn=/^-?\d+\.{0,}\d{0,}$/;  
  59.    if (!patrn.test(object.value)){   
  60.     showObject.innerHTML="<font color='#FF0000'>*输入格式不符合要求</font>" 
  61.     object.setAttribute("isCheck","0");  
  62.       
  63.    }else{   
  64.     showObject.innerHTML="<font color='#009900'>*正确</font>" 
  65.     object.setAttribute("isCheck","1");  
  66.    }  
  67.    return 
  68.   case  "erpDate":  
  69.   //日期验证  
  70.    if(toDateFromString(object.value)==0||object.value==""){  
  71.     showObject.innerHTML="<font color='#FF0000'>*输入格式不符合要求</font>" 
  72.     object.setAttribute("isCheck","0");   
  73.    }else{   
  74.     showObject.innerHTML="<font color='#009900'>*正确</font>" 
  75.     object.setAttribute("isCheck","1");  
  76.    }  
  77.    return 
  78.   case "erpMonth":  
  79.   //月份验证  
  80.    //alert('b')  
  81.    if(checkMonthFromString(object.value)==0||object.value==""){  
  82.     showObject.innerHTML="<font color='#FF0000'>*输入格式不符合要求</font>" 
  83.     object.setAttribute("isCheck","0");  
  84.    }else{   
  85.     showObject.innerHTML="<font color='#009900'>*正确</font>" 
  86.     object.setAttribute("isCheck","1");  
  87.    }  
  88.    return 
  89.   case "noNull":  
  90.   //不能为空  
  91.    if(object.value==""){  
  92.     showObject.innerHTML="<font color='#FF0000'>*请输入内容</font>" 
  93.     object.setAttribute("isCheck","0");  
  94.     }else{   
  95.     showObject.innerHTML="<font color='#009900'>*正确</font>" 
  96.     object.setAttribute("isCheck","1");  
  97.    }  
  98.    return 
  99.   case "Check":  
  100.    isCheck=0;  
  101.    for(j=0;j<object.length;j++)if(object[j].checked)isCheck++  
  102.    if(isCheck==0){  
  103.     showObject.innerHTML="<font color='#FF0000'>*请至少选择一项</font>" 
  104.     for(j=0;j<object.length;j++)object[j].setAttribute("isCheck","0");  
  105.    }else{  
  106.     showObject.innerHTML="<font color='#009900'>*正确</font>" 
  107.     for(j=0;j<object.length;j++)object[j].setAttribute("isCheck","1");  
  108.    }   
  109.    return;  
  110.   //结束..   
  111.  }  
  112.   }      
  113.  
  114. function CheckAdd(formObj,actionPage){  
  115.   var isCheck=true 
  116.   //alert(formObj.elements.length)  
  117.   for(i=0;i<formObj.elements.length;i++){  
  118.     var e=formObj.elements[i];  
  119.       
  120.     if("onBlurCheck" in e ){  
  121.      jseval=e.getAttribute("onBlurCheck")  
  122.      eval_r(jseval);  
  123.      isCheck=isCheck&e.attributes["isCheck"].nodeValue  
  124.      }  
  125.    }  
  126.    if(isCheck){  
  127.      formObj.action=actionPage  
  128.      formObj.submit()  
  129.     }  
  130.    else{  
  131.     alert('请输完必选项才能够继续!')  
  132.      }  
  133.  }  
  134. </script>  

由于时间问题,现在程序只能对INT类型,MONEY类型,不能为空,和类似201201,20120101,的日期格式,多选框进行进行验证,其他的可以自行扩展。以后再进行补充,在需要验证的空间中加入如下属性:

  
  
  
  
  1. isCheck=0//是一个自定义的属性,判断控件是否通过验证  
  2. onBlurCheck="inputJsCheck(document.getElementById('<这里输入本控件的ID>'),'<验证类型>',document.getElementById('<这里输入验证提示DIV的ID>'))"//这个是一段验证的函数的调用  
  3. onBlur="eval(this.getAttribute('onBlurCheck'))"//这是一段验证出发时间 


例如名称为text1,的文本框,其中它的验证提示信息显示在LABtext1的DIV中,并且只能输入MONEY类型。

  
  
  
  
  1. <input name="text1" type=text id="text1"  isCheck=0  
    onBlurCheck="inputJsCheck(document.getElementById('text1'),'Money',document.getElementById('LABtext1'))" 
    onBlur="eval(this.getAttribute('onBlurCheck'));" > 
  2. <div id="LABtext1">*必须输入Money类型</div> 

提交按钮时候也应该对提交form中在进行一边沿着,调用上边的CheckAdd函数,写成如下形式:

  
  
  
  
  1. <input type="button" name="b1" value="提交" 
    onClick="CheckAdd(document.getElementById('<提交form的ID>'),'<提交的页面>');"> 

整个例子下载附件

你可能感兴趣的:(JavaScript,公司,程序,主题)