时间戳

首页 > 解决方案 > 设置 minDate 以防止在开始日期之前选择结束日期

javascript - 设置 minDate 以防止在开始日期之前选择结束日期

问题描述

我有一个开始日期和结束日期供我选择日期。我正在使用 jQuery datepicker 库。

这就是我的函数现在的样子：

$(function() {

        $(".txtEndDate").datepicker({
            changeMonth: true,
            changeYear: true,
            showOn: 'button',
            buttonImage: '../../../images/calendar.png',
            buttonImageOnly: true,
            title:'Click to open calendar',
            alt:'Click to open calendar'
        });


    });




    $(function() {

        $(".txtStartDate").datepicker({
            changeMonth: true,
            changeYear: true,
            showOn: 'button',
            buttonImage: '../../../images/calendar.png',
            buttonImageOnly: true,

            title:'Click to open calendar',
            alt:'Click to open calendar',

            onSelect: function() {
                var start = $(this).datepicker("getDate");
                start.setDate(start.getDate() + 7);
                $(".txtEndDate").datepicker("setDate", start);
            }

        });



    });

它有效，但我想在不允许用户选择今天之前的日期时做到这一点，因为无论如何它没有意义。例如，选择2018-01-01不应该是有效的。你明白了。

找到了一个建议minDate用来解决这个问题的文档。它说：

//initialize the datepicker
$( ".selector" ).datepicker({
  minDate: new Date(2007, 1 - 1, 1)
});

//get or set mindate option
// Getter
var minDate = $( ".selector" ).datepicker( "option", "minDate" );

// Setter
$( ".selector" ).datepicker( "option", "minDate", new Date(2007, 1 - 1, 1) );

看到我对字段代表的内容感到困惑，有没有办法可以阻止人们选择今天之前的任何日期？

我试过这个解决方案： jQuery Date Picker - disable past dates

但它不会禁用它，仍然允许我选择。

标签： javascriptjquery

解决方案

您可以使用 datepicker 插件的 minDate 属性禁用过去的日期，如下所示。

$(".txtEndDate").datepicker({
            minDate: new Date(),  // Add this to diсable past date
            changeMonth: true,
            changeYear: true,
            showOn: 'button',
            buttonImage: '../../../images/calendar.png',
            buttonImageOnly: true,
            title:'Click to open calendar',
            alt:'Click to open calendar'
        });

推荐阅读