jquery-validator.js插件校验

首先引入文件

<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.metadata.js" type="text/javascript"></script>
<script src="jquery.validate.js" type="text/javascript"></script>

在JS里配置文件 名字针对标签的属性name

//配置校验参数 
$().ready(function(){
$("#dbform").validate({
  rules:{
  f_52_insroot_2:"slywlx",
  f_52_insroot_4:"dateISO",
  f_52_insroot_5:"required",
  f_52_insroot_6:"required",
  f_52_insroot_7:"required",
  f_52_insroot_8:{required:true,checkcard:"f_52_insroot_6"},
  f_52_insroot_9:{required:true,checkcard:"f_52_insroot_7"},
  f_52_insroot_10:{required:true,isIdCardNo:"f_52_insroot_8"},
  f_52_insroot_11:{required:true,isIdCardNo:"f_52_insroot_9"},
  f_52_insroot_12:"required",
  f_52_insroot_13:"required",
  f_52_insroot_14:{required:true,dateISO:true,iscanmarry:"男"},
  f_52_insroot_15:{required:true,dateISO:true,iscanmarry:"女"},
  f_52_insroot_20:{junren:"f_52_insroot_8"},
  f_52_insroot_21:{junren:"f_52_insroot_9"},
  f_52_insroot_24:{required:true,jhlb:"f_52_insroot_25"},
  f_52_insroot_25:{required:true,jhlb:"f_52_insroot_24"},
  f_52_insroot_26:{required:true,jhlbyhyzk:"f_52_insroot_24"},
  f_52_insroot_27:{required:true,jhlbyhyzk:"f_52_insroot_25"},
 
  },
  messages:{
  f_52_insroot_4:"受理日期格式不正确",
  f_52_insroot_5:"请选择是否为补办婚姻",
  f_52_insroot_6:"请选择男方人员类别",
  f_52_insroot_7:"请选择女方人员类别",
  f_52_insroot_8:{required:"请选择男方身份证类别",checkcard:"男方身份证类别选择不正确"},
  f_52_insroot_9:{required:"请选择女方身份证类别",checkcard:"女方身份证类别选择不正确"},
  f_52_insroot_10:{required:"请输入男方身份证件号码",isIdCardNo:"男方身份证号码不正确"},
  f_52_insroot_11:{required:"请输入女方身份证件号码",isIdCardNo:"女方身份证号码不正确"},
  f_52_insroot_12:"请输入男方姓名",
  f_52_insroot_13:"请输入女方姓名",
  f_52_insroot_14:{required:"请输入男方出生日期",dateISO:"男方出生日期格式不正确",iscanmarry:"男方未满法定婚龄"},
  f_52_insroot_15:{required:"请输入女方出生日期",dateISO:"女方出生日期格式不正确",iscanmarry:"女方未满法定婚龄"},
  f_52_insroot_20:{junren:"男方职业选择不正确"},
  f_52_insroot_21:{junren:"女方职业选择不正确"},
  f_52_insroot_24:{required:"请选择男方结婚类别"},
  f_52_insroot_25:{required:"请选择女方结婚类别"},
  f_52_insroot_26:{required:"请选择男方婚姻状况",jhlbyhyzk:"男方结婚类别和婚姻状况不一致"},
  f_52_insroot_27:{required:"请选择女方婚姻状况",jhlbyhyzk:"女方结婚类别和婚姻状况不一致"},
  },
  errorContainer: $('div.container'), 

  });
 

  });    

自定义函数检验

//男女结婚类别校验
   $.validator.addMethod("jhlb",function(value,element,param){        //value是输入的值，param是配置文件输入的参数
      var index=document.getElementsByName(param)[0].selectedIndex;
        var jhlb=document.getElementsByName(param)[0].options[index].text;
          if (value == '初婚') {
         if (jhlb != '初婚' && jhlb != '再婚') {
           return false;
         }
       }      
       if (jhlb != '复婚' && value == '复婚') {
        return false;
       }      
       return true;
   },'双方结婚类别矛盾');

 

分别在每个检验的输入框后自动生成错误提示

页面的显示框 <div class="container" style="display: none">输入有误</div>