Question

<div class="form-group">
    <div class="col-md-4 col-md-offset-4">
        <label>Start Date</label>
        <script>
            //$(".selector").datepicker({ beforeShowDay: $.datepicker.noWeekends })
            $(".datepicker").datepicker({ beforeShowDay: $.datepicker.noWeekends })
            //$(".date").datepicker("setDate", new Date());
        </script>
        <input type="date" class="form-control" id="startDate" />
    </div>
</div>

如何将日历的开始日期设置为今天的日期？我已经尝试了注释掉的代码，但它们不起作用。或者是否可以设置输入min = datetime.today或其他什么？另外，我如何禁用周末？我已经尝试过如何操作，但代码对我不起作用。

我第一次使用带有<script>标签的代码，是否有任何我需要添加到代码中的内容？因为似乎所有的jquery（？）代码都适用于其他代码而不适合我，所以我觉得我错过了一些东西，所以它可能不起作用。

最后一个问题。如果我还要禁用公众假期，如果公共假期存储在Excel文件中，我该怎么办呢？

编辑

 $(document).ready(function(){
    $('#startDate').datepicker({
    minDate: new Date(),
    beforeShowDay: $.datepicker.noWeekends
    });
})

Answer 1

您有一个内联脚本，您尝试在元素存在于DOM之前选择元素。另外，选择器指的是不存在的元素。将脚本移动到页面底部（紧接关闭</body>标记之前），或将其包装在$( document ).ready()中。脚本应该是

$(document).ready(function(){
    $('#startDate').datepicker({
        minDate: new Date(),
        beforeShowDay: $.datepicker.noWeekends
    });
})

将最短日期设置为今天的日期，并禁用周末日期的选择。要设置特定日期，请使用minDate: new Date(2015, 10, 4)，将最短日期设置为2105年11月4日（请注意，月份为零，因此1月份为0）。

要包含其他不可选日期，您可以创建一个传递给beforeShowDay选项的函数。首先，将日期数组传递给视图，作为视图模型属性或ViewBag属性，并将其分配给可能导致说明的javascript变量

var dates = ['11/16/2015', '11/25/2015'];

然后构建一个新的时间数组

var holidays = [];
for (i = 0; i < dates.length; i++) {
    var vals = dates[i].split('/');
    var y = parseInt(vals[2]);
    var m = parseInt(vals[0]) - 1;
    var d = parseInt(vals[1]);
    var holiday = new Date(y, m, d);
    holidays.push(holiday.getTime());
}

并创建以下功能

function noHoliday(date) {
    if(holidays.indexOf(date.getTime()) > -1) {
       return [false];
    } else {
       return [true];
    }
}

function noWeekendsOrHolidays(date) {
    var noWeekend = $.datepicker.noWeekends(date);
    if (noWeekend[0]) {
        return noHoliday(date);
    } else {
        return noWeekend;
    }
}

然后将datepicker脚本修改为

$('#startDate').datepicker({
    minDate: new Date(),
    beforeShowDay: noWeekendsOrHolidays
});

请参阅 this fiddle 了解工作示例

Answer 2

关于第一个问题，假设您正在使用JQueryUI：

$('.datepicker').datepicker({
      minDate: new Date()
});

应该为你做。

至于第二种情况，我将不得不研究一下，因为我也想知道这一点。 Excel可能有点尴尬，但可以很容易地导出到更适合网络的东西。这可能涉及将听众附加到您的“更改”事件并获取当月的假期然后做某事。

Datepicker设置为今天的日期并禁用周末

2 个答案: