javascript - JQuery datepicker:禁用日期显式启用
问题描述
我有一个过滤可选日期的日期选择器。要求只有 T、W、Th 和每月一个随机星期六。到目前为止,我已经能够使用下面的代码完成此操作。现在,我的客户希望能够出于各种原因(例如假期、办公室关闭等)阻止 T、W、Th 的某些日子。我不确定如何完成这个新请求。有任何想法吗?
var SaturdayDate = ["7-25-2020", "8-15-2020" ];
$(function() {
$("#my_date_picker").datepicker({
beforeShowDay: function(dt) {
return [dt.getDay() == 2 || dt.getDay() == 3 || dt.getDay() == 4 || enableThisDay(dt), ""];
},
minDate: 1
});
});
function enableThisDay(date) {
var oDate = $.datepicker.formatDate('m-d-yy', date);
if ($.inArray(oDate, SaturdayDate) != -1) {
return [true];
}
}
解决方案
我会保留任何数组以使用Date
对象而不是字符串,从而消除格式作为潜在问题。我有两个数组:“随机”星期六和节假日。然后我将有一个函数来检查日期是否启用。
// Dates in JS use 0 indexed months, so 6 is July and 7 is August
var saturdays = [ new Date(2020, 6, 25), new Date(2020, 7, 15) ];
var holidays = [ new Date(2020, 6, 22), new Date(2020, 6, 2), new Date(2020, 7, 13) ];
$(function() {
$("#my_date_picker").datepicker({
beforeShowDay: enableThisDay,
minDate: 1
});
});
function enableThisDay(date) {
var enabled = false;
// if it's Tue, Wed, Thu, enable it
if ([2,3,4].includes(date.getDay())) {
enabled = true;
}
// if it's a holiday, disable it
if (holidays.some(h => h.valueOf() === date.valueOf())) {
enabled = false;
}
// if it's a saturday, disable it
// note that if it's a saturday, that overrides holiday
// if holidays override saturday, swap this statement with
// the one immediately above
if (saturdays.some(s => s.valueOf() === date.valueOf())) {
enabled = true;
}
return [enabled, ""];
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylehseet">
<link href="https://code.jquery.com/ui/1.12.1/themes/ui-lightness/jquery-ui.css" rel="stylehseet">
<input type="text" id="my_date_picker">
推荐阅读
- sql - RedShift Error when using COUNT (Distinct XXX) ERROR: XX000: This type of associated subquery patterns is not supported due to internal error
- java - 谷歌地图大标记在点击时不准确
- javascript - Javascript - 使用 Google API 创建地图
- c# - 调试器完成后查看最后一个变量值
- java - 如何使用 XPath 从以下子元素中提取文本
- android - Android Manifest 怎么会再次合并?2
- c++ - 在 'for (auto c : str)' 中,c 到底是什么?
- ios - 在 Swift 中的 cellForRowAtIndexPath 中编写闭包是有效的方法吗?
- ios - 失败后再次尝试播放 AVPlayerItem
- amazon-web-services - 用于 sg 源 ips 的 K8S 服务负载均衡器注释