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

【问题标题】：set available dates in jquery datepicker to green color?将jquery datepicker中的可用日期设置为绿色？
【发布时间】：2017-08-04 09:44:48
【问题描述】：

我尝试在我的日期选择器绿色中提供可用日期。到目前为止，我设法将所有日期的颜色更改为绿色。虽然可用日期是深绿色，但我宁愿将不可用日期设置为灰色。我怎样才能做到这一点？下面是我的代码。

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;
}

【问题讨论】：

标签： jquery jquery-ui datepicker

【解决方案1】：

添加这个css规则：

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

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

【讨论】：