DatePicker 屏蔽周末

Question

我需要跳过 DatePicker 日历上的周末。下面的第一个 post 帮助我弄清楚了如何阻止周末，但是，它本身并不能满足我的需要。

让我举几个例子：

假设今天是星期一。最好的 3 个选项将在星期一显示，周二和周三。
现在假设今天是星期四。日历上接下来显示的 3 个选项是星期四、星期五和星期一。
最后说今天是星期六。日历上接下来显示的 3 个选项将是星期一、星期二、星期三。

换句话说，select 应该总是有 3 天可用，而且应该只是工作日。

<script>
//initialise datepicker
$(function() {
    $( ".datepicker").datepicker({
        dateFormat: 'dd/mm/yy',
         minDate: 0,
         maxDate: 2
    });
  /*
  $('body').on('focus',".datepicker", function(){
    $(this).datepicker({dateFormat: 'dd/mm/yy'});
  })*/

  $('.cal').on('click', function(e) {
    var target = $(this).closest('.calendar').find('.datepicker');
    target.datepicker('show');
  });
});

</script>

Answer 1

假设您正在使用 jQuery UI 日期选择器（其他日期选择器可用）：

$( "#datepicker" ).datepicker({
    dateFormat: 'dd/mm/yy',
    minDate: 0,
    maxDate: 2,
    beforeShowDay: $.datepicker.noWeekends
});

Link 到 documentation.

beforeShowDay 接受一个函数作为回调来确定要显示的日期，该函数根据日期返回 true 或 false。例如，可以提供一个自定义函数来仅排除星期日。

Answer 2

我认为这是一个非常肮脏的 hack，你可以克服它：

$("#datepicker").datepicker({
    dateFormat: 'dd/mm/yy',
    beforeShowDay: $.datepicker.noWeekends,
    minDate: 0,
    maxDate: (function () {
        var today = new Date().getDay(), add = 0;
        switch (today) {
            case 0:
                add = 1;
                break;
            case 4:
            case 5:
            case 6:
                add = 2;
                break;
        }
        return 2 + add;
    })()
});

DatePicker 屏蔽周末

DatePicker block out weekends

jquery

datepicker