淘宝网女装新款秋装连衣裙裤子外套上衣_2012时尚女装新款 Ecmall二次开发-PHP技术

javascript验证表单form的通用函数
    做web开发的时候，相信大家都会遇到一个比较麻烦的问题。如在做一个form提交的时候，需要验证很多东西。如验证必填项是否填写、该填数字的是否填写了数字、应该为日期型的是否为日期型等等。如果一个form有10几个文本框或者几十个文本框的时候，我想这个工作量还是挺大的。我做项目的时候，就经常遇到这样的问题，为了偷偷懒，自己写了个javascript函数供自己使用，用起来比以前快多了。大家可以直接通过以下链接下载下面的两个文件。
文件1：check.js
文件2：test.html

新建一个check.js文件，文件内容为：
//check.js开始
  //使用方法：在form提交事件里调用：return checkOwnRule(objfrm)；传入参数为当前form对象。使用该函数的前提是页面必须包含check.js
  function checkOwnRule(objfrm){
    var inputObj=objfrm.getElementsByTagName("input");
    for (i=0;i<inputObj.length;i++){
      if (!inputObj(i).getAttribute("hint")||inputObj(i).getAttribute("hint") == "")
      {
        strHint=inputObj(i).name;
      }else{
        strHint=inputObj(i).getAttribute("hint");
      }
  
      if (inputObj(i).getAttribute("allownull")=="false"){ //证明该输入框不允许为空,allow为自己在文本框中定义的属性。如<input type="text" name="UserName" allownull="false" hint="用户名">表示用户名不允许为空。Hint属性最好设置，因为在alert的时候会包含该值。
        if (inputObj(i).value==""){
          alert(strHint+"不能为空！");
          inputObj(i).focus();
          return false;
        }
      }

      //如果某项的class为digital，表示数字项。则检测是否为数字。
      if (inputObj(i).getAttribute("className")=="digital"){
        if (inputObj(i).value!=""&&isNaN(inputObj(i).value)){
          alert(strHint+"必须为数字！");
          inputObj(i).focus();
          return false;
        }
      }
      

      
      if (inputObj(i).getAttribute("isInt")=="true"){ //证明该输入框必须输入整数
        if (inputObj(i).value.indexOf(".")>=0){
          alert(strHint+"必须为整数！");
          inputObj(i).focus();
          return false;
        }  
      }
        
      if (inputObj(i).getAttribute("allowzero")=="false"){ //证明该输入框不允许输入0
        if (inputObj(i).value==0){
          alert(strHint+"不能为0！");
          inputObj(i).focus();
          return false;
        }  
      }          
      //如果isdate为true，表示该项为日期项，则必须输入日期
      if (inputObj(i).getAttribute("isdate")=="true"){
        if (inputObj(i).value!=""&&!checkdate(inputObj(i).value)){
          alert(strHint+"必须为正确的日期格式！");
          inputObj(i).focus();
          return false;
        }
      }
    
    }  
    
    var selectObj=objfrm.getElementsByTagName("select");
    for (i=0;i<selectObj.length;i++){
      if (selectObj(i).getAttribute("allownull")=="false"){ //证明该选择框不允许为空
        if (selectObj(i).value==""){
          alert(strHint+"不能为空！");
          selectObj(i).focus();
          return false;
        }
      }
    }
    return true;
  }
//该函数为检测是否为日期的函数。
function checkdate(str){
  var reg = /^(\d+)-(\d{1,2})-(\d{1,2})$/;
  var r = str.match(reg);
  if(r==null)return false;
  r[2]=r[2]-1;
  var d= new Date(r[1], r[2],r[3]);
  if(d.getFullYear()!=r[1])return false;
  if(d.getMonth()!=r[2])return false;
  if(d.getDate()!=r[3])return false;

  return true;
}
//check.js结束

Html文件中的写法：
<style>.digital {text-align:right}</style><script language="javascript" src="check.js"></script><a href="http://www.laohucheng.com">点击进入我的网站</a><form name="testform" action="" method="post" onsubmit="return checkForm(this)">用户名：<input type="text" name="username" hint="用户名" allownull="false">(必须输入)<br>日期：<input type="text" name="testdate" hint="日期" allownull="false" isdate="true">(必须输入且为日期型)<br>金额：<input type="text" name="testamount" hint="金额" allownull="false" class="digital">(必须输入且为数值型)<br>数量：<input type="text" name="testqty" hint="数量" allownull="false" class="digital" isInt="true" allowzero="false">(必须输入且必须输入整数，且不能输入0)<br><input type="submit" value="提交"></form><script language="javascript">function checkForm(objform){if (checkOwnRule(objform)){         return true;}else{         return false;}}      </script>

作者：noel@淘宝网女装新款秋装连衣裙裤子外套上衣_2012时尚女装新款 Ecmall二次开发-PHP技术
地址：http://www.laohucheng.com/post/241/
版权所有©转载时必须以链接形式注明作者和原始出处及本声明！