从下个月开始日历禁用日期

Calendar disable dates from next month

我正在使用 JQuery 来阻止一些日期,但下个月有空。 用户可以点击今天+5,其他的都应该被禁用。 我做错了什么?

  <div id='datepicker' onchange="test(this)">
  </div>
        
    $('#datepicker').datepicker(
        {
            numberOfMonths: 2,
            beforeShowDay: function (date) {

              
                var hilight = [true, 'isActive'];
                var today = new Date();
                var blockdays = new Date();
               // var startdayofmonth = new Date(today.getFullYear(), today.getMonth(), 1);
                today.setDate(today.getDate() + 5);
                blockdays.setDate(blockdays.getDate() + 12);
                blockdays = moment(blockdays.toLocaleDateString(), 'MM.DD.YYYY').format('YYYY-DD-MM');
                var blockendofmonth = new Date(today.getFullYear(), today.getMonth() + 1, 1);;
                blockendofmonth = moment(blockendofmonth.toLocaleDateString(), 'MM.DD.YYYY').format('YYYY-DD-MM');
                today = moment(today.toLocaleDateString(), 'MM.DD.YYYY').format('YYYY-DD-MM');
                date = moment(date.toLocaleDateString(), 'MM.DD.YYYY').format('YYYY-DD-MM');
               
              
             
                if (date < today) {
                    hilight = [false, ''];
                }
                else if (date >= blockdays) {
                    hilight = [false, ''];
                }

                return hilight;
            }
        }

    );

比较 YYYY-DD-MM 格式的日期字符串给出了错误的结果。 '2021-10-04' < '2021-20-03' 这评估为 true' 这实际上是不正确的。比较日期字符串时,最好遵循 YYYY-MM-DD:HH:MM:SS 格式以获得更好的结果。在代码段下方结帐。

$(document).ready(function () {
    var allowDays = getAllowDays();
    $('#datepicker').datepicker({
        numberOfMonths: 2,
        beforeShowDay: function (date) {
            var hilight = [true, 'isActive'];
            var start = allowDays[0];
            var end = allowDays[1];
            var currentDate = +moment(date).format('YYYYMMDD');
            if (currentDate < start) {
                hilight = [false, ''];
            } else if (currentDate >= end) {
                hilight = [false, ''];
            }
            return hilight;
        }
    });
});
function getAllowDays() {
    var today = new Date();
    var blockdays = new Date();
    today.setDate(today.getDate() + 5);
    blockdays.setDate(blockdays.getDate() + 12);
    return [+moment(today).format('YYYYMMDD'), +moment(blockdays).format('YYYYMMDD')];
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.9.2/jquery.ui.datepicker.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css"/>
<div id='datepicker'></div>