jQuery-将变量推入数组而没有警报

Question

我正在使用一个预订日历，该日历将针对公共假期检查数据库，我将日期传递给php，而php将对照数据库进行检查（如果存在），jquery会将“ styleCls”设置为“ nice-gray” ”，如果没有，它将“ styleCls”设置为“ nice-normal”。但是以某种方式，它仅在我向“ styleCls”发出警报时才起作用，如果删除警报，日历会将所有“ styleCls”反映为“ nice-gray”。请帮助我。

var styleCls = [];    
var teststyleCls = [];
$('#customercheckoutreview').on('click',function(){
$("#content").load('customercheckout_review.php', function(){
    e.preventDefault();
    $(document).off('click');
});
});

/**
 * nice date picker
*/
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
    typeof define === 'function' && define.amd ? define(factory) :
        (global.niceDatePicker = factory());
}(this, function () {
'use strict';

var niceDatePicker = function ($params) {
    this.$warpper = null;
    this.monthData = null;
    this.$params = $params;
    this.init(this.$params);
};

niceDatePicker.prototype.getMonthData = function (year, month) {
    var year, month;
    var ret = [];

    if (!year || !month) {
        var today = new Date();
        year = today.getFullYear();
        month = today.getMonth() + 1;
    }
    var firstDay = new Date(year, month - 1, 1);
    var firstDayWeekDay = firstDay.getDay();
    if (firstDayWeekDay === 0) {
        firstDayWeekDay = 7;
    }
    year = firstDay.getFullYear();
    month = firstDay.getMonth() + 1;


    var lastDayOfLastMonth = new Date(year, month - 1, 0);
    var lastDateOfLastMonth = lastDayOfLastMonth.getDate();
    var preMonthDayCount = firstDayWeekDay - 1;
    var lastDay = new Date(year, month, 0);
    var lastDate = lastDay.getDate()

    var k=1;

    for (var i = 0; i < 7 * 6; i++) {               
        var date = i + 1 - preMonthDayCount;
        var showDate = date;
        var thisMonth = month;
        var thisYear = year;
        var today = new Date();


        //gray next previous month
        if (date <= 0) {
            thisMonth = month - 1;
            showDate = lastDateOfLastMonth + date;
            styleCls = 'nice-gray';
        } 
        else if (date > lastDate) {
            thisMonth = month + 1;
            showDate = showDate - lastDate;
            styleCls = 'nice-gray';
        } 
        else {
            var today = new Date();
            if (showDate === today.getDate() && thisMonth === today.getMonth() + 1 && thisYear === today.getFullYear()) {
                styleCls = 'nice-current';
            } 
            else if (showDate <= today.getDate() && thisMonth === today.getMonth() + 1) {
                styleCls = 'nice-gray';
            }
            else if ((thisMonth < today.getMonth() + 1) && (thisYear == today.getFullYear())) {
                styleCls = 'nice-gray';
            }
            else if (thisYear < today.getFullYear()) {
                styleCls = 'nice-gray';
            }
            else{
                //gray 3 day before actual day
                if (showDate <= today.getDate() + 2 && thisMonth === today.getMonth() + 1) {
                    styleCls = 'nice-gray';
                }
                else if (Number.isInteger(k/7)) {
                    styleCls = 'nice-gray';
                    if(k==8){
                        k=1;
                    }
                }
                else{
                    //gray ph hpliday
                    var dateToday = showDate;
                    var dateMonth = month;

                    if(dateToday<10) {
                        dateToday = '0'+dateToday;          
                    } 
                    if(dateMonth<10) {
                        dateMonth= '0'+dateMonth;
                    }
                    var checkday = thisYear + '-' + dateMonth + '-' + dateToday;
                    $.get('checkavailableday.php',{checkday:checkday},function(data) {
                        var holiday = JSON.parse(data);
                        if(holiday[0].color == "nice-gray"){
                            window.styleCls = 'nice-gray';
                        }
                        else{
                            window.styleCls = 'nice-normal';
                        }
                    });
                }
            }
        }           
        k++;
        alert(showDate+"==>"+styleCls+"<==");
        if (thisMonth === 13) {
            thisMonth = 1;
        }
        if (thisMonth === 0) {
            thisMonth = 12;
        }
        ret.push({
            month: thisMonth,
            date: date,
            showDate: showDate,
            styleCls: styleCls
        });
        console.log(ret);
    }
    return {
        year: year,
        month: month,
        date: ret
    };
};

niceDatePicker.prototype.buildUi = function (year, month) {
    this.monthData = this.getMonthData(year, month);
    this.dayWords = [['?', '?', '?', '?', '?', '?', '?'], ['Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su']];
    this.enMonthsWords = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'June', 'July', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];

    var html = '<div class="nice-date-picker-warpper">' +
        '<div class="nice-date-picker-header">' +
        '<a href="javascript:;" class="prev-date-btn">&lt;</a>';

    if (!this.$params.mode) {
        this.$params.mode = 'zh';
        html += '<span class="nice-date-title">' + this.monthData.year + '? - ' + this.monthData.month + '?</span>';
    } else if (this.$params.mode === 'en') {
        html += '<span class="nice-date-title">' + this.enMonthsWords[this.monthData.month - 1] + ',' + this.monthData.year + '</span>';
    } else if (this.$params.mode === 'zh') {
        html += '<span class="nice-date-title">' + this.monthData.year + '? - ' + this.monthData.month + '?</span>';
    }

    html += '<a href="javascript:;" class="next-date-btn">&gt;</a>' +
        '</div>' +
        '<div class="nice-date-picker-body">' +
        '<table>' +
        '<thead>' +
        '<tr>';
    if (!this.$params.mode) {
        this.$params.mode = 'zh';
        for (var i = 0; i < this.dayWords[0].length; i++) {
            html += '<th>' + this.dayWords[0][i] + '</th>';
        }
    } else if (this.$params.mode === 'en') {
        for (var i = 0; i < this.dayWords[1].length; i++) {
            html += '<th>' + this.dayWords[1][i] + '</th>';
        }
    } else if (this.$params.mode === 'zh') {
        for (var i = 0; i < this.dayWords[0].length; i++) {
            html += '<th>' + this.dayWords[0][i] + '</th>';
        }
    }
    html += '</tr>' +
        '</thead>' +
        '<tbody>';

    for (var i = 0; i < this.monthData.date.length; i++) {
        if (i % 7 === 0) {
            html += '<tr>';
        }
        html += '<td class="' + this.monthData.date[i].styleCls + '" data-date="' + this.monthData.date[i].showDate + ' ' + this.enMonthsWords[this.monthData.month - 1] + ' ' + this.monthData.year + '">' + this.monthData.date[i].showDate + '</td>';
        if (i % 7 === 6) {
            html += '</tr>';
        }
    }
    html += '</tbody>' +
        '</table>' +
        '</div>' +
        '</div>';
    return html;
};
niceDatePicker.prototype.render = function (direction, $params) {
    var year, month;
    if (this.monthData) {

        year = this.monthData.year;
        month = this.monthData.month;

    } else {
        year = $params.year;
        month = $params.month;
    }
    if (direction === 'prev') {
        month--;
        if (month === 0) {
            month = 12;
            year--;
        }
    }
    if (direction === 'next') {
        month++;

    }
    var html = this.buildUi(year, month);
    this.$warpper.innerHTML = html;
};
niceDatePicker.prototype.init = function ($params) {
    this.$warpper = $params.dom;
    this.render('', $params);
    var _this = this;
    this.$warpper.addEventListener('click', function (e) {
        var $target = e.target;
        if ($target.classList.contains('prev-date-btn')) {
            _this.render('prev');
        }
        if ($target.classList.contains('next-date-btn')) {
            _this.render('next');
        }
        if ($target.classList.contains('nice-normal')) {
            $params.onClickDate($target.getAttribute('data-date'));
        }
    }, false);
    this.$warpper.addEventListener('mouseover', function (e) {
        var $target = e.target;
        if ($target.classList.contains('nice-normal')) {
            $target.classList.add('nice-active');
        }
    }, false);
    this.$warpper.addEventListener('mouseout', function (e) {
        var $target = e.target;
        if ($target.classList.contains('nice-normal')) {
            $target.classList.remove('nice-active');
        }
    }, false);
};
return niceDatePicker;
}));

new niceDatePicker({
dom:document.getElementById('calendar1-wrapper2'),
year:2018,
mode:'en',
onClickDate:function(date){
    document.querySelector('#calendar2-msg').innerHTML=''+date;
}
});