Question

我尝试在我的datepicker绿色中提供日期。 Sofar我设法将所有日期的颜色更改为绿色。虽然可用日期是深绿色，但我宁愿将不可用日期设置为灰色。我怎么能做到这一点？以下是我的代码。

JS：

    $(function() {
        var availableDates = ["9-5-2017","14-5-2017","15-5-2017"];

        function available(date) {
            dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
            if ($.inArray(dmy, availableDates) != -1) {
                return [true, "","Available"];
            } else {
                return [false,"","unAvailable"];
            }
        }

        $( "#datepicker" ).datepicker({ 
            firstDay: 1,
            dayNamesMin: ['Sö', 'Må', 'Ti', 'On', 'To', 'Fr', 'Lö'],
            beforeShowDay: available
        });
    });

CSS：

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    color: green;
    background: lightgreen;
}

编辑：功能部分解决方案（仅更改边框）：

return [true, "availableStyle","Available"];
// CSS
.availableStyle {
    background: green !important;
}

Answer 1

添加此css规则：

.ui-state-disabled .ui-state-default {
    color: black;
    background: white;
}

小提琴：https://jsfiddle.net/jds6Lb3x/

将jquery datepicker中的可用日期设置为绿色？

1 个答案: