1

有没有办法将jQuery UI Datepicker以前选择的日期设置为不同的类？

我正在处理的场景是有一个包含即将发生的事件和以前的事件的日历。即将到来的事件现在得到一个应用到它们的类并相应地设置样式。我需要对以前有事件的日期做同样的事情。

例如：

5 月 10 日将被涂成金色（精彩课程），因为这是即将举行的活动。

5 月 8 日将显示为浅灰色（已通过事件类），因为它是之前的事件。

这是我到目前为止所拥有的（从beforeShowDay 开始工作）：

beforeShowDay: function(date) {
                    var result = [true, '', null],
                        afterOrToday = $.grep(events, function(event) {

                            var eventDate = new Date(event.Date),
                                todaysDate = new Date();

                            return date.valueOf() === eventDate.valueOf();
                        }),
                        beforeToday = $.grep(events, function(event) {

                            var eventDate = new Date(event.Date),
                                todaysDate = new Date();

                            return date.valueOf() < eventDate.valueOf();
                        });

                    if (afterOrToday.length)
                        result = [true, 'highlight', null];
                    else if (beforeToday.length)
                        result = [true, 'passed-event', null];

                    return result;
                }
4

2 回答 2

2

请参阅此示例http://jsbin.com/imiyez/1/edit：

您可以比较没有 valueOf 的日期：

[true, ('past' if date < yesterday )]
于 2013-05-09T17:41:36.023 回答
1

不确定这是否是最有效的方法，并且会喜欢有关更改以提高质量的建议，但这是我想出的解决方案。

beforeShowDay: function(date) {
    var result = [true, '', null],
        today = $.grep(events, function(event) {

            var eventDate = new Date(event.Date);

            return date.valueOf() === eventDate.valueOf();
        }),
        beforeToday = $.grep(events, function(event, i) {

            var eventDate = new Date(event.Date),
                isPast = false;

            if (date.valueOf() === eventDate.valueOf())
                if (date.valueOf() < new Date().valueOf())
                    isPast = true;

            return isPast;
        });

    if (today.length)
        result = [true, 'highlight', null];

    if (beforeToday.length)
        result = [true, 'past-event', null];

    return result;
}

这将为我过去的日期添加一个课程，该课程在 2 个单独的课程中具有事件以及未来的日期。感谢大家的帮助！

于 2013-05-09T18:31:44.187 回答