Jquery日期选择器启用数组中的日期

Jquery datepicker enable dates from array?

本文关键字：日期 数组 启用 选择器 Jquery      更新时间：2023-09-26

我正试图在日期选择器中只启用一些指定的日期。在我的例子中，变量"onlyThisDates"中的值。我应该使用enabledDates选项来解决这个问题还是。。？我不想禁用数组中的值。相反。我想禁用所有内容，只启用数组中的值。

如果有人能帮忙，那就太好了。

<input id="openDatepick></input>

var onlyThisDates = ['09/11/2015', '10/11/2015', '11/11/2015'];    
var nowDate = new Date();
var today = new Date(nowDate.getFullYear(), nowDate.getMonth(), nowDate.getDate(), 0, 0, 0, 0);
$('#openDatepick').datepicker({
    format: 'dd/mm/yyyy',
    startDate: today
}).on('changeDate', function (e) {
    //$('this').datepicker('hide');
});
$("#remove").on("click", function () {
    $('.datepicker-days').hide();
});

在beforeShowDay函数中：对于任何日期，您都会返回false-这将被禁用，对于任何日期都会启用当天返回false以外的任何东西。

基于此，您的beforeShowDay应该如下所示：-

beforeShowDay: function (date) {
        var dt_ddmmyyyy = date.getDate() + '/' + (date.getMonth() + 1) + '/' + date.getFullYear();
        return (onlyThisDates.indexOf(dt_ddmmyyyy) != -1);
    }

注意，我在getMonth()中添加了1，因为javascript中的月份从0开始。

请参阅此处的jsFiddle。

编辑：基于评论

在beforeShowDay函数中，我们可以定义css、工具提示等。例如，我们可以返回一个css类，而不是返回true。

beforeShowDay: function (date) {
        var dt_ddmmyyyy = date.getDate() + '/' + (date.getMonth() + 1) + '/' + date.getFullYear();
        if (onlyThisDates.indexOf(dt_ddmmyyyy) != -1) {
            return {
                tooltip: 'This date is enabled',
                classes: 'active'
            };
        } else {
            return false;
        }
    }

请参阅此jsFiddle。

另请参阅此链接，了解引导程序日期选择器提供的不同功能。

以下代码将使用日期选择器禁用一周中的天数，属性为'daysOfWeekDisabled'需要周id 的数组

$(".dateControl").datepicker({
            daysOfWeekDisabled: [1,2,3],
            startDate: new Date(),
            autoclose: true
        })
相关文章：