Javascript 使用JQuery验证的最大日期

如何使用Jquery验证设置（当前日期的）最大日期

$('#form').validate({
        rules: {
            reportDate: {
                date: true
                //Max date rule of current date...
            }
        }
    });

---

您可以添加验证方法，将最大日期设置为当前日期，如下所示

$.validator.addMethod("maxDate", function(value, element) {
    var curDate = new Date();
    var inputDate = new Date(value);
    if (inputDate < curDate)
        return true;
    return false;
}, "Invalid Date!");   // error message

注：日期

'12/03/2013'

被解释为

'mm/dd/yyyy'

，
因此

12/03/2013>06/26/2013（今天的日期）

，因此无效

---

您需要一种验证方法，日期格式非常关键。使用datepicker格式化函数会有所帮助。下面是您可以传递要检查的日期和日期格式作为参数的代码。将“0”作为日期传递需要“今天”

/**
*需要日期选择器和验证器
*
*参数：
*0…日期格式。请参阅日期选择器
*1…日期。值“0”是“今天”
*2…（可选）。要显示的日期。如果设置了0和1，将自动填充。
*用法：
*myfield:{maxDate:['m/d/yy'，0]}
*/
jQuery.validator.addMethod（“maxDate”，
函数（值、元素、参数）{
如果（！params[0]）
抛出'params missing dateFormat'；
if（typeof（params[1]）==“未定义”）
抛出“参数缺少maxDate”；
var dateFormat=params[0]；
var maxDate=params[1]；
如果（maxDate==0）{
maxDate=新日期（）；
maxDate.setHours（0）；//设为00:00:0
maxDate.setMinutes（0）；
maxDate.setSeconds（0）；
maxDate.setMillistics（0）；
}
if（typeof（params[2]）==“未定义”）
参数[2]=$.datepicker.formatDate（dateFormat，maxDate）；
试一试{
var valueAsDate=$.datepicker.parseDate（日期格式，值）
返回（valueAsDate

HTML:

---

我认为这是一个更优雅的解决方案，因为您可以随意更改日期格式，并将其与日期选择器一起使用

// Datepicker
$('#date_start').datepicker({
    dateFormat: 'dd.mm.yy',
    maxDate: "+0",
    onClose: function() {$(this).valid();},
}).datepicker("setDate", new Date());


// Validation method
$.validator.addMethod("maxDate", function(e) {
    var curDate = $('#date_start').datepicker("getDate");
    var maxDate = new Date();
    maxDate.setDate(maxDate.getDate());
    maxDate.setHours(0, 0, 0, 0); // clear time portion for correct results
    console.log(this.value, curDate, maxDate);
    if (curDate > maxDate) {
        $(this).datepicker("setDate", maxDate);
        return false;
    }
    return true;
});


//Date validation
$("#form").validate({
    // Rules for form validation
    rules: {
        date_start:{
            required: true,
            maxDate: true
        },
    },

    messages: {
        date_start:{
            required: 'Enter date_start',
            maxDate: 'Must be today date or less',
        },
    },
    //Error placement
    errorPlacement: function (error, element) {
       error.insertAfter(element.parent());
    }
});

//HTML
<input type="text" name="date_start" id="date_start">

//日期选择器
$（“#日期_开始”）。日期选择器({
日期格式：“年月日”，
maxDate:“+0”，
onClose:function（）{$（this）.valid（）；}，
}).datepicker（“setDate”，new Date（））；
//验证方法
$.validator.addMethod（“maxDate”，函数（e）{
var curDate=$（'date_start'）。日期选择器（“getDate”）；
var maxDate=新日期（）；
maxDate.setDate（maxDate.getDate（））；
maxDate.setHours（0,0,0,0）；//清除时间部分以获得正确的结果
console.log（this.value、curDate、maxDate）；
如果（curDate>maxDate）{
$（this）.datepicker（“setDate”，maxDate）；
返回false；
}
返回true；
});
//日期验证
$（“#表格”）。验证({
//表单验证规则
规则：{
开始日期：{
要求：正确，
maxDate：对
},
},
信息：{
开始日期：{
必需：“输入开始日期”，
maxDate:'必须是今天日期或更少'，
},
},
//错误放置
errorPlacement:函数（错误，元素）{
错误.insertAfter（element.parent（））；
}
});
//HTML

/**
 * Requires Datepicker and Validator
 *
 * Params: 
 * 0...dateformat. see datepicker
 * 1...date. Value "0" is "today"
 * 2...(optional). date to display. will be automatically filled if 0 and 1 are set.
 * usage:
 * myfield: { maxDate: ['m/d/yy', 0] }
 */
jQuery.validator.addMethod("maxDate", 
    function(value, element, params) {
        if (!params[0])
            throw 'params missing dateFormat';
        if (typeof(params[1]) == 'undefined' )
            throw 'params missing maxDate';

        var dateFormat = params[0];
        var maxDate = params[1];
        if (maxDate == 0) {
            maxDate = new Date();
            maxDate.setHours(0); // make it 00:00:0
            maxDate.setMinutes(0);
            maxDate.setSeconds(0);
            maxDate.setMilliseconds(0);
        }
        if (typeof(params[2]) == 'undefined' )
            params[2] = $.datepicker.formatDate(dateFormat, maxDate);

        try {
            var valueAsDate = $.datepicker.parseDate( dateFormat, value )
            return (valueAsDate < maxDate);
        } catch (x) {
            return false;
        }

    },'Must be before {2}.');


$("#myform").validate({
    rules: {
        datepicker : { 
            maxDate ['m/d/yy', 0]
        }
    }
});

<input name="datepicker" class="datepicker" type="text"/>

// Datepicker
$('#date_start').datepicker({
    dateFormat: 'dd.mm.yy',
    maxDate: "+0",
    onClose: function() {$(this).valid();},
}).datepicker("setDate", new Date());


// Validation method
$.validator.addMethod("maxDate", function(e) {
    var curDate = $('#date_start').datepicker("getDate");
    var maxDate = new Date();
    maxDate.setDate(maxDate.getDate());
    maxDate.setHours(0, 0, 0, 0); // clear time portion for correct results
    console.log(this.value, curDate, maxDate);
    if (curDate > maxDate) {
        $(this).datepicker("setDate", maxDate);
        return false;
    }
    return true;
});


//Date validation
$("#form").validate({
    // Rules for form validation
    rules: {
        date_start:{
            required: true,
            maxDate: true
        },
    },

    messages: {
        date_start:{
            required: 'Enter date_start',
            maxDate: 'Must be today date or less',
        },
    },
    //Error placement
    errorPlacement: function (error, element) {
       error.insertAfter(element.parent());
    }
});

//HTML
<input type="text" name="date_start" id="date_start">