JQuery UI 日期选择器 - 添加 class 到每个日期

JQuery UI Datepicker - add class to each date

我正在尝试向内联日期选择器中的每个单元格添加包含日期的 class。这是我的初始化代码:

    var currentTime = new Date();
    var maxDate =  new Date(currentTime.getFullYear(), currentTime.getMonth() +1, 0);

    $( "#calendar_wrapper1" ).datepicker({ 
        inline: true,
        changeMonth: false,
        minDate: "0",
        maxDate: maxDate,
        beforeShowDay: function(date) {
           return [true, "d_" + date.getYear() + '_' + (date.getMonth() + 1) + '_' + date.getDay()];
        }
    });

这个 returns class d_115_12_3 12 月 30 日。 2015,好像只有月份显示正确,或者我不明白这是什么格式。

制作了 jsfiddle:https://jsfiddle.net/NorthSea/8xg1w842/

你只需要更换

发件人:

return [true, "d_" + date.getYear() + '_' + (date.getMonth() + 1) + '_' + date.getDay()];

收件人:

return [true, "d_" + date.getFullYear() + '_' + (date.getMonth() + 1) + '_' + date.getDate()];

阅读 .getFullYear() and .getDate()

var currentTime = new Date();
var maxDate =  new Date(currentTime.getFullYear(), currentTime.getMonth() +1, 0);
$( "#calendar_wrapper1" ).datepicker({ 
  inline: true,
  changeMonth: false,
  minDate: "0",
  maxDate: maxDate,
  beforeShowDay: function(date) {
    return [true, "d_" + date.getFullYear() + '_' + (date.getMonth() + 1) + '_' + date.getDate()];
  }
});


var currentTime = new Date();
// First Date Of the month 
var startDateFrom = new Date(currentTime.getFullYear(),currentTime.getMonth() +1,1);
// Last Date Of the Month 
var startDateTo = new Date(currentTime.getFullYear(),currentTime.getMonth() +2,0);
$("#calendar_wrapper2").datepicker({
  changeMonth: false,
  inline: true,
  minDate: startDateFrom,
  maxDate: startDateTo,
  beforeShowDay: function(date) {
    return [true, "d_" + date.getFullYear() + '_' + (date.getMonth() + 1) + '_' + date.getDate()];
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<link href="https://code.jquery.com/ui/1.11.4/themes/black-tie/jquery-ui.css" rel="stylesheet" />
<h2>
  This month
</h2>
<div id="calendar_wrapper1">
</div>
<h2>
  Next month
</h2>
<div id="calendar_wrapper2"></div>