GO TO THE DEMO

Question

我正在试图弄清楚如何禁用比今天更早的所有日期，这对于我在下面使用的引导日期时间选择器来说变得棘手。

这些示例允许在创建对象时传递日期数组：

$(function () {
                $('#datetimepicker7').datetimepicker({
                    defaultDate: "11/1/2013",
                    disabledDates: [
                        moment("12/25/2013"),
                        new Date(2013, 11 - 1, 21),
                        "11/22/2013 00:53"
                    ]
                });
            });

如何在不计算今天之前的所有日期并将其传递给函数的情况下如何做到这一点？

文档：http://eonasdan.github.io/bootstrap-datetimepicker/#example8

Answer 1

我认为你找了一个糟糕的选择......

文档：请点击此处：http://eonasdan.github.io/bootstrap-datetimepicker/#options

在此文档中，选项的名称为minDate

提取：

    minuteStepping:1,               //set the minute stepping
    minDate:`1/1/1900`,               //set a minimum date  <---- HERE 
    maxDate: ,

Answer 2

        $(function () {
            $('#datetimepicker7').datetimepicker({
                defaultDate: moment("11/01/2013", "DD-MM-YYYY"),
                minDate: moment()
            });
        });

Answer 3

除了设置minDate属性外，您可能还希望在当前时间之前禁用次。你可以这样做：

首先，您需要将minDate参数初始化为当天的午夜。然后，将事件侦听器绑定到dp.change事件，并拒绝之前的任何时间而不是当前时间。拒绝这样的时间时，您通知用户并将DateTimePicker时间重置为当前时间。我已经创建了一个函数来执行此操作：

// Argument obj is the used DateTimePicker object
// Argument f is the selected datetime by the user
// Argument n is the current datetime
var checkDate = function (obj, f, n) {
    if (f.getTime() < n.getTime()+60*1000 && !open) {
        open = true;
        $('#message').dialog({
            modal: true,
            position: ['center', 'center'],
            show: 'blind',
            hide: 'blind',
            width: 400,
            dialogClass: 'ui-dialog-osx',
            buttons: {
                "I understand. Let me try again": function () {
                    $(this).dialog("close");
                    obj.data('DateTimePicker').setDate(n);
                    open = false;
                }
            }
        });
    }
}

同样，您仍希望更新minDate上的maxDate和dp.change参数。因此，结合检查时间和更新属性，您将得到：

jQuery("#startDate").on("dp.change", function (e) {
    var f = new Date(e.date);    var n = new Date();
    checkDate(jQuery('#startDate'), f, n);
    jQuery('#endDate').data("DateTimePicker").setMinDate(e.date);
});
jQuery("#endDate").on("dp.change", function (e) {
    var f = new Date(e.date);    var n = new Date();
    checkDate(jQuery('#startDate'), f, n);
    jQuery('#startDate').data("DateTimePicker").setMaxDate(e.date);
});

这将完全符合您的要求：

enter image description here

您可以在我为您准备的jsFiddle中找到完整的代码：

使用datetimepicker禁用比今天更早的日期

3 个答案:

GO TO THE DEMO