3

我正在使用 jquery 的 datepicker 来选择日期，并且我想突出显示一些日期 - 但我遇到了beforeShowDay的一个奇怪问题。

当页面加载时，似乎加载了 json 数据，但是当我点击输入框并出现 datepicker 时，没有突出显示。在我点击前一个月或后一个月后，上个月的数据被加载（例如点击输入->出现日期选择器->没有突出显示->点击下个月->上个月的数据突出显示）...

我已经用谷歌搜索了很长时间，检查是否在一切之前加载了数据，但不知何故这种行为并没有改变。两个日期选择器都遇到同样的问题。

(jquery-ui datepicker 1.10.1, jquery 1.9.1)

我很高兴每一个提示！

var resDates;
var done = false;

function markDate(date) {
    var ret = [true, 'free'];

    if (!done) {
        $.ajax({
            dataType: "json",
            url: "modules/OutShop/getReservations.php",
            data: {item_id: $("#item-id").val()},
            async: false,
            success: function (dates) {
                resDates = dates;
                done = true;
            }
        });
    }


    $.each(resDates, function(key, value) {
        var d = (date.getFullYear() + "-" + ("0" + date.getMonth()).slice(-2) + "-" + ("0" + date.getDate()).slice(-2));
        if (d == value["day"]) {
        //$("body").append("d: " + d + ", v: " + value["day"] + ", s: " + value["status"] + "  ");
        //$("body").append("s: " + value["status"] + "  ");
            if (value["status"] == "1")
                ret = [false, 'marked'];
            else if (value["status"] == "2")
                ret = [false, 'reserved'];
            else
                ret = [true, 'free'];
        }
    });

    return ret;
}

$(document).ready(function() {


    if (!done) {
        $.ajax({
            dataType: "json",
            url: "modules/OutShop/getReservations.php",
            data: {item_id: $("#item-id").val()},
            async: false,
            success: function (dates) {
                resDates = dates;
                //done = true;
            }
        });
    }

    $("#item-datepicker-min").datepicker({
        showButtonPanel: true,
        defaultDate: +3,
        minDate: +3,
        beforeShowDay: markDate,
        onSelect: function(selectedDate) {
            $("#item-datepicker-max").datepicker("option", "minDate", selectedDate);
        }
    });

    $("#item-datepicker-max").datepicker({
        showButtonPanel: true,
        minDate: +3,
        defaultDate: +6,
        beforeShowDay: markDate,
        onSelect: function(selectedDate) {
            $("#item-datepicker-min").datepicker("option", "maxDate", selectedDate);
        }
    });
});

编辑 欲了解更多信息：这是我从 ajax 响应中获得的示例 json 对象。

[{"status":3,"day":"2013-04-10"},{"status":3,"day":"2013-04-11"},{"status":3,"day ":"2013-04-12"},{"status":3,"day":"2013-04-13"},{"status":2,"day":"2013-04-10"} ,{"status":2,"day":"2013-04-11"},{"status":2,"day":"2013-04-12"},{"status":2,"day ":"2013-04-13"}]

4

1 回答 1

1

看起来您的月份偏移了 1，javascript 方法 date.getMonth() 返回从零开始的月份（例如，一月是 0，二月是 1）并且您的 PHP 脚本以正常格式返回日期（一月是 1，二月是 2)

检查这个

所以如果你改变

var d = (date.getFullYear() + "-" + ("0" + date.getMonth()).slice(-2) + "-" + ("0" + date.getDate()).slice(-2));

到

var d = (date.getFullYear() + "-" + ("0" + date.getMonth()+1).slice(-2) + "-" + ("0" + date.getDate()).slice(-2));

你应该得到正确的月份显示

于 2013-03-15T20:54:45.507 回答