javascript中的日历小部件

Question

用JavaScript创建日历（如jquery Datepicker ）的最佳方法是什么，我可以在其中添加更多功能？

我想以不同的颜色在其中显示日期数组，以及选择一个日期。

我应该尝试编辑源代码，还是更好地使用一些库自己做？

对于第一种情况，我想找到有关jQuery Datepicker源的一些很好的文档。 对于第二个，我想找到一些库，它创建了一个易于使用的日历。

Answer 1

我想以不同的颜色在其中显示日期数组，以及选择一个日期。

jQueryUI的日期选择器已经具有此功能。

疯狂的演示

$(function() {
    var someDates = ['10/8/2010', '10/28/2010', '10/30/2010']; // the array of dates

    $("#datepicker").datepicker({
        beforeShowDay: function(date) {
            for (var i = 0; i < someDates.length; i++) {
                if (new Date(someDates[i]).toString() == date.toString()) {

                    return [true,'someDates']; // someDates here is a class
                    // with that added class you could do your style..
                    // html would then be rendered something like this,
                    // <td class="someDates"><a href="">8</a></td>
                }
            }
            return [true];
        }
    });
});​

你可以做更多的事情。 尝试阅读event-beforeShowDay

Answer 2

如果您不介意编写自己的代码，则可以尝试我的calendar-logic.js 。

它根本没有UI。 您将完全控制日历的外观和行为，而不必担心一个月中有多少周背后的数学运算等。

Answer 3

jQuery Datepicker小部件已经为日历提供了足够的功能。 添加自定义颜色更多是一种样式（因此是CSS）。 此外，很容易找到文档，因此Googling也很容易找到它 。

最后，编辑源代码绝不是一个好主意，因为升级将覆盖您的更改。

Answer 4

看看extjs日历-它看起来更具可扩展性-并且还有一个专业版（收费）

http://www.sencha.com/blog/2010/09/08/ext-js-3-3-calendar-component/