JQuery Datepicker自定义CSS

时间:2014-03-06 10:51:12

标签: jquery datepicker

我有以下代码:

<script>

    function reservedDates(date)
    {
        var reserved = ["2014-03-03","2014-03-04","2014-03-05","2014-03-06","2014-03-07","2014-03-08","2014-03-17","2014-03-18","2014-03-19","2014-03-20","2014-03-21","2014-03-22",];
        var checkoutDates = ["2014-03-09","2014-03-23",];
        var string = jQuery.datepicker.formatDate('yy-mm-dd', date); 
        return [ reserved.indexOf(string) == -1 ];
    }

        $.datepicker.setDefaults($.datepicker.regional['nl']);

        $(function() {
        $( "#startDate, #endDate" ).datepicker({
            beforeShowDay: reservedDates,
            minDate: 0 });

    });

    </script>

哪个很好用,但正如你所看到的,我得到了第二个名为checkoutDates的数组我希望更改这些单元格的CSS但不禁用它们。我不知道该怎么做。

我看着这个小提琴:http://jsfiddle.net/ambiguous/pjJGf/但我不知道如何更改它以使它适合我。

1 个答案:

答案 0 :(得分:1)

css您可以使用该代码

.ui-datepicker td {
    border: 1px solid #CCC;
    padding: 0;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    border: solid #FFF;
    border-width: 1px 0 0 1px;
}