Boostrap 日期选择器，按周期禁用一周中的日子

Question

我目前正在尝试添加日期选择器并禁用一周中的某些日子（例如星期一），以防止在办公室关闭的那些日子进行预订。我找到了

daysOfWeekDisabled

参数，它工作得很好，但不是专门用于此目的：

$('#date_return').datetimepicker({
    language: "es",
    format: 'dd/mm/yyyy',
    autoclose: true,
    todayHighlight: true,
    showMeridian: false,
    startView: 2,
    minView: 2,
    maxView: 1,
    pickerPosition: "bottom-left",
    daysOfWeekDisabled: $scope.daysClosedInLocationOfReturn
});

此设置按预期工作，但现在我需要使其适用于特定时期。例如，从 12/31/2024 到 12/30/2025，然后是另一个时期从 12/31/2025 到 12/30/2026。此外，日期可能会根据时期而变化。

我也在网上搜索，发现我希望能解决我的问题：

isInvalidDate: function(date) {
    return date.day() === 0 || date.day() === 6;
}

通过此功能，我认为我可以添加更多条件来检查其他条件，例如特定年份或其他条件。然而，它并没有按预期工作——它既没有禁用星期几，也没有显示任何错误消息。有什么办法可以阻止特定时间段内的特定日期吗？

Answer 1

不确定您是否可以使用当前的日期选择器隐藏特定时期。

但是您可以使用 Bootstrap Datepicker

来做到这一点

您可以使用

beforeShownDay

选项来实现您的自定义逻辑。

示例：

$('#date_return').datepicker({
   language: "es",
   format: 'dd/mm/yyyy',
   autoclose: true,
   todayHighlight: true,
   pickerPosition: "bottom-left",
   beforeShowDay: function(date) {
       var day = date.getDay(); // 0 (Sunday) ... 6 (Saturday)

       // The periods with the days to disable
       var periods = [
           {
               start: new Date(2024, 11, 31),
               end: new Date(2025, 11, 30),
               daysToDisable: [1] // Mondays
           },
           {
               start: new Date(2025, 11, 31),
               end: new Date(2026, 11, 30),
               daysToDisable: [2, 3] // Tuesdays and Wednesdays
           }
       ];

       for (var i = 0; i < periods.length; i++) {
           var period = periods[i];
           if (date >= period.start && date <= period.end) {
               if (period.daysToDisable.includes(day)) {
                   return false; // Disable this specific date
               }
           }
       }
       return true; // Enable all other dates
   }
});