Question

我正在为客户工作的网站，在我使用Jquery UI Calendar的网站上，我需要能够突出显示当前日期后2天开始的3个工作日，但包含数学不计算周末。这是我的小提琴：

这是HTML

<input type="text" id='datepicker'>

这是JS

var SelectedDates = {};
SelectedDates[new Date('04/14/2014')] = new Date('04/14/2014');
SelectedDates[new Date('04/15/2014')] = new Date('04/15/2014');
SelectedDates[new Date('04/16/2014')] = new Date('04/16/2014');

$('#datepicker').datepicker({
    minDate: 2,
    maxDate: "+4M +15D",
    beforeShowDay: function (date) {
        var Highlight = SelectedDates[date];
        if (Highlight) {
            return [true, "Highlighted", Highlight];
        } else {
            return [true, '', ''];
        }
    }
});

我无法在上面的代码中添加beforeShowDay: $.datepicker.noWeekends。我还需要突出显示为变量的3个日期，因此它们会根据当前日期的变化而变化，但我仍在学习JS，而我不了解其背后的逻辑。

我已经浏览了这个网站和其他网站，虽然有很多关于如何突出显示具体日期的问题/答案，但没有一个完全适用于我想要做的事情。

所以只是为了澄清我需要做数学来弄清楚如何否定minDate和周末并突出显示接下来的三个工作日。

Answer 1

<强>更新

这是一种方法：

var currentDay = new Date();
    var dayOfWeek;
    var highlighted = 0;
    var count = 0;
    var SelectedDates = {};

    while(highlighted < 3){
       dayOfWeek = currentDay.getDay();
        if(dayOfWeek != 0 && dayOfWeek != 6){
            if(count > 1){
                alert(currentDay);
                var month = currentDay.getMonth()+1;
                if(month.toString().length < 2)
                    month = '0'+month;
                var day = currentDay.getDate();
                if(day.toString().length < 2)
                    day = '0'+day;
                var year = currentDay.getFullYear();
                var dateStr = month+"/"+day+"/"+year;   
                SelectedDates[new Date(dateStr)] = new Date(dateStr);
                highlighted++;
            }
            else {
                count++;    
            }
        }
        currentDay = new Date(currentDay.getTime() + (24 * 60 * 60 * 1000));    
    }

示例：

FIDDLE

Answer 2

这应该这样做：

<强> jsFiddle example

$(document).ready(function () {
    var css, count = 0,
        gap = 0,
        today = new Date();
    $('#datepicker').datepicker({
        showOtherMonths: true,
        selectOtherMonths: true,
        minDate: 2,
        maxDate: "+4M +15D",
        beforeShowDay: function (date) {
            var day = date.getDay();
            var diff = new Date(date - today);
            var numDays = Math.ceil(diff / 1000 / 60 / 60 / 24);
            if (numDays > 0 && count < 3) {
                if (day != 6 && day != 0) {
                    gap++;
                    if (gap > 1) {
                        count++;
                        css = 'Highlighted';
                    } else css = '';
                }
            } else css = '';
            return [(day != 6) && (day != 0), css]; //0-Sunday 6-Saturday
        },
        onSelect: function () {
            count = 0;
            gap = 0;
        }
    });
});

Jquery UI日历 - 如何突出显示当前日期之后的天数？

2 个答案: