在jquery datepicker中更改特定日期的背景颜色

问题描述：

我想知道如何在datePicker中的日期上设置背景色；我遵循了很多教程，但没有得到任何结果.

I want to know how to set background color on the dates in a datePicker; I followed a lot of tutorials but I didn`t get any result.

我有这个datePicker:

I have this datePicker:

<div id="datepicker"></div>

答

以防万一Mongoose的链接有一天变坏，最好在*上发布完整答案:

Just in case Mongoose's link goes bad someday it is best to post full answers here on *:

这是使用 beforeShowDay 的日期选择器的工作代码段和屏幕截图. jQueryUI datepicker的a>函数:

Here is a working code snippet and screenshot of what the datepicker looks like using the beforeShowDay function of the jQueryUI datepicker:

$(document).ready(function() {
    var SelectedDates = {};
    SelectedDates[new Date('04/05/2016')] = new Date('04/05/2016');
    SelectedDates[new Date('05/04/2017')] = new Date('05/04/2017');
    SelectedDates[new Date('06/06/2018')] = new Date('06/06/2018');

    $('#txtDate').datepicker({
        beforeShowDay: function(date) {
            var Highlight = SelectedDates[date];
            if (Highlight) {
                return [true, "Highlighted", Highlight];
            }
            else {
                return [true, '', ''];
            }
        }
    });
});

body
{
    font-family:Arial;
    font-size : 10pt;
    padding:5px;
}

.Highlighted a{
   background-color : Green !important;
   background-image :none !important;
   color: White !important;
   font-weight:bold !important;
   font-size: 12pt;
}

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>

<input type='text' id='txtDate' />

小提琴: http://jsfiddle.net/jquerybyexample /cqf9d/?utm_source = website& utm_medium = embed& utm_campaign = cqf9d

文档: jquery ui文档位于beforeShowDay

在jquery datepicker中更改特定日期的背景颜色

相关推荐