您可以使用您的代码库尝试以下一个。(这是一个示例)
CSS
.Highlighted a{
background-color : Green !important;
background-image :none !important;
color: White !important;
font-weight:bold !important;
font-size: 12pt;
}
jQuery
$(document).ready(function() {
var SelectedDates = {};
SelectedDates[new Date('12/25/2012')] = new Date('12/25/2012');
SelectedDates[new Date('05/04/2012')] = new Date('05/04/2012');
SelectedDates[new Date('06/06/2012')] = new Date('06/06/2012');
$('#txtDate').datepicker({
beforeShowDay: function(date) {
var Highlight = SelectedDates[date];
if (Highlight) {
return [true, "Highlighted", Highlight];
}
else {
return [true, '', ''];
}
}
});
});
更新 1
这里的工作示例
Jquery 文档说有"beforeShowDay:" Option。
检查Datepicker 小部件 API
更新 2:
您可以使用 Google CDN 引用 jquery,如下所示。因此,注释掉您的 jquery 引用并如下所示。
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.css"
type="text/css" media="all" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
更新 3:
下面我只提到了伪代码。根据Jquery语法更改它。
$(document).ready(function() {
$('#txtDate').datepicker({
beforeShowDay: function(date) {
//according to the date you have to decide which css should load.
var Highlight = SelectedDates[date];
var yourColor = whichColor(SelectedDates[date]);
if (Highlight && yourColor =='red') {
return [true, "RedHighlighted", Highlight];
}
else if (Highlight && yourColor =='green') {
return [true, "GreenHighlighted", Highlight];
}
else {
return [true, '', ''];
}
}
});
//return a color according to your date logic
function whichColor(dateArray) {
return color;
}
});</p>
有关更多信息,请检查突出显示 jQuery UI DatePicker 中的特定日期
我希望这对你有帮助。