禁用周末和特定日期 jQueryUI datepicker

Question

我想禁用日期选择器中的周末，以及数组中的特定日期。我注意到我无法在 beforeShowDay 中组合这两个选项，因为它只接受 1 个函数。有没有办法在 beforeShowDay 中添加 2 个函数？

$(function() {
  var unavailableDates = ["27-12-2021", "28-12-2021", "29-12-2021", "30-12-2021", "31-12-2021", "01-01-2022", "02-01-2022", "03-01-2022", "04-01-2022"];

  function unavailable(date) {
    dmy = date.getDate() + "-" + (date.getMonth() + 1) + "-" + date.getFullYear();
    if ($.inArray(dmy, unavailableDates) == -1) {
      return [true, ""];
    } else {
      return [false, "", "Unavailable"];
    }
  }

  $("#datepicker").datepicker({
    dateFormat: "dd-mm-yy",
    changeMonth: false,
    changeYear: false,
    minDate: '10D',
    beforeShowDay: $.datepicker.noWeekends, unavailable // throws an error becaus ei have 2 options
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.13.0/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" />
<input type="text" id="datepicker" />

Answer 1

问题是因为 beforeShowDay 属性只接受一个函数。

要执行您需要的操作，您可以创建一个匿名函数，您可以在其中调用 noWeekends() 和 unavailable() 函数并组合结果，如下所示：

jQuery($ => {
  let unavailableDates = ["27-12-2021", "28-12-2021", "29-12-2021", "30-12-2021", "31-12-2021", "01-01-2022", "02-01-2022", "03-01-2022", "04-01-2022"];
  let isUnavailable = date => $.inArray(`${date.getDate()}-${(date.getMonth() + 1)}-${date.getFullYear()}`, unavailableDates) >= 0;

  $("#datepicker").datepicker({
    dateFormat: "dd-mm-yy",
    changeMonth: false,
    changeYear: false,
    minDate: '10D',
    beforeShowDay: date => {
      if (isUnavailable(date) || !$.datepicker.noWeekends(date)[0]) {
        return [false, "", "Unavailable"];
      } else {
        return [true, ""];
      }
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.13.0/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" />
<input type="text" id="datepicker" />

禁用周末和特定日期 jQueryUI datepicker

Disable weekends and specific dates jQueryUI datepicker

javascript

jquery

jquery-ui-datepicker