Question

我过去使用过JQuery UI DatePicker，我很满意。我正在寻找一种方法向用户显示未来的多个日期。我不希望用户能够选择日期，我只想让它们在运行时修复它们。

有没有简单的方法可以实现这一目标？

Answer 1

您可以使用beforeShowDay事件执行此操作。

// list of dates to highlight
var dates = [
    [2011, 8, 1],
    [2011, 8, 9],
    [2011, 8, 25]
];

$('#datepicker').datepicker({
    beforeShowDay: function (date){
        var year = date.getFullYear(), month = date.getMonth(), day = date.getDate();

        // see if the current date should be highlighted
        for (var i=0; i < dates.length; ++i)
            if (year == dates[i][0] && month == dates[i][1] - 1 &&  day == dates[i][2])
            return [false, 'ui-state-highlight ui-state-active'];

        return [false];
    }
});

参见示例：http://jsfiddle.net/william/VzZYU/

Answer 2

我不认为执行此操作的功能内置于datepicker中。所以，似乎没有一种简单的方法来做你所要求的。

但是，您可以通过将ui-datepicker-current-day类应用于多个日期来实现此目的。您必须通过查找要选择的日期的标记来手动执行此操作。

要阻止用户选择日期，您可以使用"disable" datepicker方法或"disabled"选项。但是，这会使日历变暗。另一种可能的方法是处理onSelect事件并将css类重新分配给多个日期，并从用户选择的日期中删除它。

JQuery UI Datepicker作为多日期显示

2 个答案: