使用jQuery验证插件的自定义日期格式

答

您可以使用addMethod函数创建自己的自定义验证方法。假设你想验证“DD/MM/YYYY”：

$.validator.addMethod(
    "australianDate", 
    function(value, element) { 
     // put your own logic here, this is just a (crappy) example 
     return value.match(/^\d\d?\/\d\d?\/\d\d\d\d$/); 
    }, 
    "Please enter a date in the format dd/mm/yyyy." 
);

，然后在你的表单中添加：

$('#myForm') 
    .validate({ 
     rules : { 
      myDate : { 
       australianDate : true 
      } 
     } 
    }) 
;

+0

非常棒！谢谢。 – adrianos 2009-12-16 14:56:05

+0

好东西，干杯！ – Mantisimo 2010-12-22 10:08:12

+0

它验证我的输入22/22/2222 ....为什么发生这种情况？ – 2011-02-22 11:43:45

答

nickf的回答是好，但要注意验证插件已经包含验证对于其他几种日期格式，在additional-methods.js文件中。在你自己写之前，确保有人还没有完成它。

答

退房： jQuery Masked Input Plugin

答

乔恩，你有一些语法错误，见下文，这为我工作。

<script type="text/javascript"> 
$(document).ready(function() { 

    $.validator.addMethod(
     "australianDate", 
     function (value, element) { 
     // put your own logic here, this is just a (crappy) example 
     return value.match(/^\d\d?\/\d\d?\/\d\d\d\d$/); 
     }, 
     "Please enter a date in the format dd/mm/yyyy" 
    ); 

    $('#testForm').validate({ 
    rules: { 
     "myDate": { 
     australianDate: true 
     } 
    } 
    }); 

});

答

我个人用的很不错http://www.datejs.com/库。

Docco这里：http://code.google.com/p/datejs/wiki/APIDocumentation

您可以使用下面的方法让您的澳大利亚格式，将验证闰日29/02/2012而不是29/02/2011：

jQuery.validator.addMethod("australianDate", function(value, element) { 
    return Date.parseExact(value, "d/M/yyyy"); 
}); 

$("#myForm").validate({ 
    rules : { 
     birth_date : { australianDate : true } 
    } 
});

我也使用蒙面输入插件来规范数据http://digitalbush.com/projects/masked-input-plugin/

$("#birth_date").mask("99/99/9999");

答

下面是最近为我工作的一个特定的代码示例：

// Replace the builtin US date validation with UK date validation 
$.validator.addMethod(
    "date", 
    function (value, element) { 
     var bits = value.match(/([0-9]+)/gi), str; 
     if (! bits) 
      return this.optional(element) || false; 
     str = bits[ 1 ] + '/' + bits[ 0 ] + '/' + bits[ 2 ]; 
     return this.optional(element) || !/Invalid|NaN/.test(new Date(str)); 
    }, 
    "Please enter a date in the format dd/mm/yyyy" 
);

我应该注意到，这实际上取代了内置的日期验证例程，但我看不出这会导致当前插件出现问题。

$('#my_form input.date').rules('add', { date: true });

答

$.validator.addMethod("mydate", function (value, element) { 

     return this.optional(element) || /^(\d{4})(-|\/)(([0-1]{1})([1-2]{1})|([0]{1})([0-9]{1}))(-|\/)(([0-2]{1})([1-9]{1})|([3]{1})([0-1]{1}))/.test(value); 

    });

你可以输入像yyyy-mm-dd也yyyy/mm/dd

，但无法判断该月的某个时候大小刚好二月28或：

我然后使用该应用的形式29天。

答

这是我结合/修改以前的职位，以达到我想要的结果：你的验证配置后

 // Override built-in date validator 
     $.validator.addMethod(
      "date", 
      function (value, element) { 
       //Return   NB: isRequired is not checked at this stage 
       return (value=="")? true : isDate(value); 
      }, 
      "* invalid" 
     );

添加日期验证。即在调用$（form）.validate（{...}）方法后。

 //Add date validation (if applicable) 
     $('.date', $(frmPanelBtnId)).each(function() { 
      $(this).rules('add', { 
       date: true 
      }); 
     });

最后修改英国日期格式

//Validates a date input -- http://jquerybyexample.blogspot.com/2011/12/validate-date- using-jquery.html 
function isDate(txtDate) { 
    var currVal = txtDate; 
    if (currVal == '') 
     return false; 

    //Declare Regex 
    var rxDatePattern = /^(\d{1,2})(\/|-)(\d{1,2})(\/|-)(\d{4})$/; 
    var dtArray = currVal.match(rxDatePattern); // is format OK? 

    if (dtArray == null) 
     return false; 

    //Checks for dd/mm/yyyy format. 
    var dtDay = dtArray[1]; 
    var dtMonth = dtArray[3]; 
    var dtYear = dtArray[5]; 

    if (dtMonth < 1 || dtMonth > 12) 
     return false; 
    else if (dtDay < 1 || dtDay > 31) 
     return false; 
    else if ((dtMonth == 4 || dtMonth == 6 || dtMonth == 9 || dtMonth == 11) && dtDay == 31) 
     return false; 
    else if (dtMonth == 2) { 
     var isleap = (dtYear % 4 == 0 && (dtYear % 100 != 0 || dtYear % 400 == 0)); 
     if (dtDay > 29 || (dtDay == 29 && !isleap)) 
      return false; 
    } 

    return true; 
}

答

这里主要而isDate的Javascript功能是将验证几乎任何日期格式，其中包括一个新的验证方法的例子：

dd/mm/yy或dd/mm/yyyy
dd.mm.yy or dd.mm.yyyy
DD，毫米，YY或DD，毫米，YYYY
年月日或年月日
DD-MM-YY或DD-MM-YYYY

然后，当传递的值以PHP的你可以用strtotime

这里转换是如何添加方法：

：

$.validator.addMethod("anyDate", 
    function(value, element) { 
     return value.match(/^(0?[1-9]|[12][0-9]|3[0-1])[/., -](0?[1-9]|1[0-2])[/., -](19|20)?\d{2}$/); 
    }, 
    "Please enter a date in the format!" 
);

然后你添加新的过滤器3210

$('#myForm') 
.validate({ 
    rules : { 
     field: { 
      anyDate: true 
     } 
    } 
})

;

答

很容易，例如：适用于HTML5 automatic type =“date”。

<script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/jquery.validate.min.js"></script> 
<script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/additional-methods.min.js"></script> 
<script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/localization/messages_es.js"></script> 

$(function() { 

     // Overload method default "date" jquery.validate.min.js 
     $.validator.addMethod(
      "date", 
      function(value, element) { 
       var dateReg = /^\d{2}([./-])\d{2}\1\d{4}$/; 
       return value.match(dateReg); 
      }, 
      "Invalid date" 
     ); 

    // Form Demo jquery.validate.min.js 
    $('#form-datos').validate({ 
     submitHandler: function(form) { 
      form.submit(); 
     } 
    }); 

});

答

@blasteralfred：

我有以下规则验证正确的日期对我来说（年月日）

jQuery.validator.addMethod(
"validDate", 
function(value, element) { 
    return value.match(/(?:0[1-9]|[12][0-9]|3[01]) (?:0[1-9]|1[0-2]) (?:19|20\d{2})/); 
}, 
"Please enter a valid date in the format DD MM YYYY"

）;

对于DD/MM/YYYY

jQuery.validator.addMethod(
"validDate", 
function(value, element) { 
    return value.match(/(?:0[1-9]|[12][0-9]|3[01])\/(?:0[1-9]|1[0-2])\/(?:19|20\d{2})/); 
}, 
"Please enter a valid date in the format DD/MM/YYYY"

）;

这不会验证01 13 2017和01/13/2017。

而且也不验证50 12 2017和50/12/2017。

使用jQuery验证插件的自定义日期格式

相关推荐