jquery-ui - 需要在 jquery datepicker 中突出显示日期范围

Question

我正在使用 jQuery UI 来显示一个内联日期选择器，我有一个开始日期和一个结束日期。我想突出显示它们之间的日期。

Answer 1

您可以使用 jQuery UI datepicker beforeShowDay函数并在其中检查日期是否必须根据您的范围突出显示。

函数将日期作为参数，并且必须返回一个数组，其中 [0] 等于 true/false 指示此日期是否可选，1等于 CSS 类名称或默认表示为 ""，以及 [2]此日期的可选弹出工具提示。在显示之前，它会在日期选择器中的每一天被调用。

例子：

var date1 = new Date(2013, 4, 6);
var date2 = new Date(2013, 4, 17);

$(document).ready(function () {
    $('#datepicker').datepicker({
        beforeShowDay: function (date) {
            debugger
            if (date >= date1 && date <= date2) {
                return [true, 'ui-state-error', ''];
            }
            return [true, '', ''];
        }
    });
});

这是一个工作小提琴：http: //jsfiddle.net/IrvinDominin/zz9u4/