jquery validate.addMethod 正则表达式 (自定义验证方法)

项目中使用的jQuery添加的校验的方法

$(document).ready(function(){       
  5         
  6/* 设置默认属性 */       
  7$.validator.setDefaults({       
  8    submitHandler: function(form) {    
  9        form.submit();    
 10    }       
 11});   
 12  
 13// 字符验证       
 14jQuery.validator.addMethod("stringCheck", function(value, element) {       
 15    return this.optional(element) || /^[\u0391-\uFFE5\w]+$/.test(value);       
 16}, "只能包括中文字、英文字母、数字和下划线");   
 17  
 18// 中文字两个字节       
 19jQuery.validator.addMethod("byteRangeLength", function(value, element, param) {       
 20    var length = value.length;       
 21    for(var i = 0; i < value.length; i++){       
 22        if(value.charCodeAt(i) > 127){       
 23        length++;       
 24        }       
 25    }       
 26    return this.optional(element) || ( length >= param[0] && length <= param[1] );       
 27}, "请确保输入的值在3-15个字节之间(一个中文字算2个字节)");   
 28  
 29// 身份证号码验证       
 30jQuery.validator.addMethod("isIdCardNo", function(value, element) {       
 31    return this.optional(element) || isIdCardNo(value);       
 32}, "请正确输入您的身份证号码");
 33     
 34// 手机号码验证       
 35jQuery.validator.addMethod("isMobile", function(value, element) {       
 36    var length = value.length;   
 37    var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;   
 38    return this.optional(element) || (length == 11 && mobile.test(value));       
 39}, "请正确填写您的手机号码");       
 40     
 41// 电话号码验证       
 42jQuery.validator.addMethod("isTel", function(value, element) {       
 43    var tel = /^\d{3,4}-?\d{7,9}$/;    //电话号码格式010-12345678   
 44    return this.optional(element) || (tel.test(value));       
 45}, "请正确填写您的电话号码");   
 46  
 47// 联系电话(手机/电话皆可)验证   
 48jQuery.validator.addMethod("isPhone", function(value,element) {   
 49    var length = value.length;   
 50    var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;   
 51    var tel = /^\d{3,4}-?\d{7,9}$/;   
 52    return this.optional(element) || (tel.test(value) || mobile.test(value));   
 53  
 54}, "请正确填写您的联系电话");   
 55     
 56// 邮政编码验证       
 57jQuery.validator.addMethod("isZipCode", function(value, element) {       
 58    var tel = /^[0-9]{6}$/;       
 59    return this.optional(element) || (tel.test(value));       
 60}, "请正确填写您的邮政编码");    
 61  
 62//开始验证   
 63$(‘#submitForm‘).validate({   
 64    /* 设置验证规则 */  
 65    rules: {   
 66        username: {   
 67            required:true,   
 68            stringCheck:true,   
 69            byteRangeLength:[3,15]   
 70        },   
 71        email:{   
 72            required:true,   
 73            email:true  
 74        },   
 75        phone:{   
 76            required:true,   
 77            isPhone:true  
 78        },   
 79        address:{   
 80            required:true,   
 81            stringCheck:true,   
 82            byteRangeLength:[3,100]   
 83        }   
 84    },   
 85       
 86    /* 设置错误信息 */  
 87    messages: {   
 88        username: {       
 89            required: "请填写用户名",   
 90            stringCheck: "用户名只能包括中文字、英文字母、数字和下划线",   
 91            byteRangeLength: "用户名必须在3-15个字符之间(一个中文字算2个字符)"       
 92        },   
 93        email:{   
 94            required: "请输入一个Email地址",   
 95            email: "请输入一个有效的Email地址"  
 96        },   
 97        phone:{   
 98            required: "请输入您的联系电话",   
 99            isPhone: "请输入一个有效的联系电话"  
100        },   
101        address:{   
102            required: "请输入您的联系地址",   
103            stringCheck: "请正确输入您的联系地址",   
104            byteRangeLength: "请详实您的联系地址以便于我们联系您"  
105        }   
106    },   
107       
108   /* 设置验证触发事件 */  
109    focusInvalid: false,   
110    onkeyup: false,   
111       
112    /* 设置错误信息提示DOM */  
113    errorPlacement: function(error, element) {       
114        error.appendTo( element.parent());       
115    },     
116       
117});   
118  
119});

supplier-commons-vacation.js

//定义订单的公共的函数方法
 function define_common_method(){
 
    //设置默认的操作
     $.validator.setDefaults({    
     submitHandler: function(form) { form.submit(); }    
        }); 
   
     //添加自定义校验函数
     $.validator.addMethod("charNo",function(value,element) {    
    var length = value.length;  
    var your_tel =/[\W]/g;
    return this.optional(element) || (length<=8&&!your_tel.test(value));   
  },"请输入英文字符或数字!");
  
  //添加验证操作名称的校验函数
  $.validator.addMethod("charString",function(value,element) {    
      var length = value.length;  
      var your_tel =/[^\a-zA-Z\u4E00-\u9FA5]/g;
      var your_tel2=/^[A-Za-z]*$/;
      return this.optional(element) || (length<=20&&!your_tel.test(value));   
  },"请输入中文或英文名称"); 
  
  //验证手机号码(仅仅13和15开头)
  $.validator.addMethod("isPhone", function(value,element) {   
           var length = value.length;   
        var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;   
         var tel = /^\d{3,4}-?\d{7,9}$/;   
        return this.optional(element) || (tel.test(value) || mobile.test(value));   
         }, "请正确填写您的联系电话或者手机");   
  
 }

supplier-finance.js

jQuery(function($) {
 
 //绑定所有的事件
 $(document).ready(function() {
  bind_component_event();
 });
 
 
 //绑定的公共的事件
 function bind_component_event() {
    //定义一些公共的方法
    define_common_method();
  
    //环游供应商付款的验证(度假)  
    bind_checkCondition_component_event();
    
    
    //环游供应商付款验证的(供应商)
    bind_supplierConditionForm_component_event();
 }
 
 //环游供应商付款(度假)的验证  
 function bind_checkCondition_component_event() {
  
  //待收款款订单验证
  $("#checkConditionForm").validate({
   event: "submit",
   errorPlacement: function(error, element) {
   },
   rules:{
     "searchCon.accountNo":{
      charNo:true
     },
     "searchCon.supplierName":{
      charString:true
     }
    },
    messages:{
     "searchCon.accountNo":{
        charNo:"请输入正确的对账编号!"
       },
       "searchCon.supplierName":{
        charString:"请输入正确的供应商名称!"
       }
    },
    
    //设置验证触发事件
   focusInvalid:false,
   onkeyup:false,
            
         //设置错误信息提示DOM    
   errorPlacement:function(error,element){
      error.appendTo(element.parent());
   }
    
    
  });
 }
 //环游供应商付款的验证(供应商)  
 function bind_supplierConditionForm_component_event() {
  
  //待收款款订单验证
  $("#supplierConditionForm").validate({
   event: "submit",
   errorPlacement: function(error, element) {
   },
   rules:{
     "searchCon.accountNo":{
      charNo:true
     },
     "searchCon.supplierName":{
      charString:true
     }
    },
    messages:{
     "searchCon.accountNo":{
        charNo:"请输入正确的对账编号!"
       },
       "searchCon.supplierName":{
        charString:"请输入正确的供应商名称!"
       }
    },
    
    //设置验证触发事件
   focusInvalid:false,
   onkeyup:false,
            
         //设置错误信息提示DOM    
   errorPlacement:function(error,element){
      error.appendTo(element.parent());
   }
  });
 }
 
});

关于jQuery的校验的API

http://docs.jquery.com/Plugins/Validation/Validator/addMethod

http://www.shopxx.net/html/news/2009/1201/59.html

http://jquery.bassistance.de/api-browser/plugins.html

时间: 2024-10-29 08:24:05

jquery validate.addMethod 正则表达式 (自定义验证方法)的相关文章

jquery.validate remote 和 自定义验证方法

jquery.validate remote 和 自定义验证方法 $(function(){ var validator = $("#enterRegForm").validate({debug:false, //调试模式取消submit的默认提交功能//errorClass: "error",//默认为错误的样式类为:error//validClass: "check",//验证成功后的样式,默认字符串validfocusInvalid: tr

JQuery Validate插件如何自定义验证方法(结合ajax实现数据库的查重)

概述 本文介绍Validate自定义表单校验方式.Validate插件虽然提供了丰富的验证规则,但在很多时候仍然很难满足我们的开发需求,在注册页面我们需要通过ajax验证用户输入的用户名是否已经被他人注册,那此时通过传统的Validate验证方式已经无法满足需求了! 我们可以通过自定义验证方法来结合ajax实现这个需求. 自定义ajax基本语法 因为validate是JQuery的插件,所以在此之前必须先导入JQuery和validate的JS包. <script type="text/j

jquery validate.addMethod 正则表达式

$(document).ready(function () { /* 设置默认属性 */ $.validator.setDefaults( { submitHandler: function (form) { form.submit(); } } ); // 字符验证 jQuery.validator.addMethod( " stringCheck " , function (value, element) { return this .optional(element) || /

jquery validate.js表单验证的基本用法入门--不用写繁琐的验证代码了...

jquery.validate.js是jquery下的一个验证插件,功能比较强大,早就有所耳闻但是一只没有动手用过,现在在于能够研究一下了. 这里转载一篇前辈写的文章,在我自己的理解上修改了一下,仅作记录. 先贴一个国内某大公司的代码: 1 <script type="text/javascript"> 2 function lang(key) { 3 mylang = { 4 'ls_input_myb': '请输入您的账户', 5 'ls_myb_email': '漫游

基于Jquery Validate 的表单验证

基于Jquery Validate 的表单验证 jquery.validate.js是jquery下的一个验证插件,运用此插件我们可以很便捷的对表单元素进行格式验证. 在讲述基于Jquery Validate的表单验证前,我们先回顾一下基础纯JS的表单验证. 1.回顾基于JS的表单验证 我们先写一个简单的验证邮箱.手机号的表单,页面代码如下: 1 <form action="XXXX.action" method="post" onsubmit="r

Jquery.validate.js表单验证插件的使用

作为一个网站web开发人员,以前居然不知道还有表单验证这样好呀的插件,还在一行行写表单验证,真是后悔没能早点知道他们的存在. 最近公司不忙,自己学习一些东西的时候,发现了validation的一个实例讲解应用.it's perfect. 首先记录一些使用过程中,爱犯的错误: 1>忘记给表单form添加id属性 2>input这些表单标签必须id属性和name属性名字一样.例如:<input type="text" id="name" name=&q

封装自定义验证方法-validate-methods.js

$(function(){ // 判断整数value是否等于0 jQuery.validator.addMethod("isIntEqZero", function(value, element) { value=parseInt(value); return this.optional(element) || value==0; }, "整数必须为0"); // 判断整数value是否大于0 jQuery.validator.addMethod("isI

jquery.validate.js表单验证

引用jquery封装好的js文件进行表单验证,提高了Web开发的效率.我写了一个验证的实例给大家展示一下. 实例中包含的验证方法还不全面,如果没有大家想要的可以通过 百度搜索关键:jquery.validate.js表单验证帮助文档来进行查阅. 引入的js文件: <script type="text/javascript" src="js/jquery-1.11.2.js"></script> <script type="te

[记录]jquery validate 不用submit方式验证表单或单个元素

jquery validate 不用submit方式验证表单或单个元素 jQuery validate的版本: v1.14.0 var result = $('#myForm').validate({ errorElement : 'span', errorClass : 'help-block error', rules:{ }, message:{ } }).form(); 具体的内容可以参考官网文档:http://jqueryvalidation.org/documentation/#li