想要在参数中使用日期数组(年份日历引导程序)(customDayRenderer)

时间:2018-03-30 08:45:35

标签: javascript arrays loops date iteration

所以我有一个名为customDayRenderer的选项

var redDateTime = new Date(currentYear, 2, 13).getTime(); 

$('#calendar').calendar({ 
        customDayRenderer: function(element, date) {
            if(date.getTime() == redDateTime) {
                $(element).css('font-weight', 'bold');
                $(element).css('font-size', '15px');
                $(element).css('color', 'green');
            }
            else if(date.getTime() == circleDateTime) {
                $(element).css('background-color', 'red');
                $(element).css('color', 'white');
                $(element).css('border-radius', '15px');
            }
            else if(date.getTime() == borderDateTime) {
                $(element).css('border', '2px solid blue');
            }
        }
    });

因为我有很多日期,我想改变css,我做了一个数组。

var weekendDate = [new Date (2018, 1-1,6).getTime(),new Date (2018, 1-1,7).getTime()];

如何迭代日期数组以更改css?

1 个答案:

答案 0 :(得分:0)

要直接回答您的问题,您可以执行以下操作:

var weekendDate = [new Date (2018, 1-1,6).getTime(),new Date (2018, 1-1,7).getTime()];

$('#calendar').calendar({ 
        customDayRenderer: function(element, date) {
            if (weekendDate.includes(date.getTime())) {
               // Do your custom css here
            }
        }
    });

但是,有一个更好的方法,因为你想要一些自定义css for Weekends。

您不需要构建周末数组,每当库即将呈现'day'时,都会调用customDayRenderer。所以你可以检查'天'是否是周末:

$('#calendar').calendar({ 
            customDayRenderer: function(element, date) {
                if (date.getDay() === 6 || date.getDay() === 0) { // 6 = Saturday, 0 = Sunday
                   // Do your custom css here
                }
            }
        });