FullCalendar的时区工作不正常

Timezone not working properly for FullCalendar

本文关键字：不正常工作时区 FullCalendar 更新时间：2023-09-26

仍在摆弄FullCalendar。我试图弄清楚为什么当dayClick事件被触发时，当我尝试将其设置为本地和UTC时，dateTime参数本身仍处于GMT。这基本上落后了一整天。我会点击3月19日，日期时间是3月18日。

这是我的日历配置和我的一天点击事件：

     vm.uiConfig = {
        calendar: {
           height: 350,
           editable: false,
           draggable: false,
           selectable: true,
           selectHelper: true,
           unselectAuto: false,
           disableResizing: false,
           droppable: false,
           handleWindowResize: true,
           timezone: "local",
           ignoreTimezone: false,
           header: {
              left: "title",
              center: "",
              right: "today prev,next"
           },
           dayClick: vm.dayClick
        }
     };
     vm.dayClick = function(dateTime, jsEvent, view)
     {
        // change the day's background color just for fun
        if (vm.previousCell)
           vm.previousCell.css("background-color", vm.previousCellCSS);
        vm.previousCell = $(this);
        vm.previousCellCSS = vm.previousCell.css("background-color");
        vm.previousCell.css("background-color", "lightgrey");
        vm.selectedDate = {
           date: new Date(dateTime)
        };
     };

我也尝试过调整"时区"、"utc"answers"ignoreTimezone"属性，没有成功。我看到一些人说这是我的操作系统时钟的问题，因为这是时间的来源，但我觉得这里不是这样。有什么想法吗？我已经达到了顶峰，但没有运气。提前感谢！

我在使用MySQL数据库的FullCalendar V2.3.1、JQuery V1.11.2、Moment V2.10.2和Moment时区V0.3.1时遇到了同样的问题。

问题在于事件的开始日期和结束日期的数据类型。我一直把它们存储为dateTime。当我改为将它们存储为timeStamps时，它就开始工作了。以下是我的代码中重要元素的摘录。希望这对你有帮助。

$('#calendar').fullCalendar({
        events: function(start, end, timezone, callback) {
            $.ajax( {
                url: '/s/calendar_eventdata.php',
                method: 'POST',
                dataType: 'json',
                data: 'uid=' + uidArray + '&start=' + start + '&end=' + end,
                success: function(userData) {
                    var user_count = userData.length;
                    var eventData = [];
                    // Assemble the event objects
                    for (var i = 0; i < user_count; i++)
                    {
                        var uid = userData[i].uid;
                        var source = '/s/calendar_eventdata.php?e=' + userData[i].uid;
                        // Determine if the event is all day
                        var all_day = false;
                        if(userData[i].allDay === 1)
                        {
                            all_day = true;
                        }
                        // Add each source to a JSON feed object
                        eventData.push({
                            source: source,
                            id: userData[i].eid,
                            eid: userData[i].eid,
                            p_eid: userData[i].p_eid,
                            uid: userData[i].uid,
                            p_uid: userData[i].p_uid,
                            etid: userData[i].etid,
                            typeIcon: userData[i].icon,
                            title: userData[i].title,
                            location: userData[i].location,
                            description: userData[i].description,
                            allDay: all_day,
                            start: moment.tz(userData[i].start_date, userData[i].saveTimezone).tz(deviceTimeZone),
                            end: moment.tz(userData[i].end_date, userData[i].saveTimezone).tz(deviceTimeZone),
                            saveTimezone: userData[i].saveTimezone,
                            duration: userData[i].duration, // todo: display as days, minutes, hours instead of only minutes
                            pharmaPropName: userData[i].pharmaPropName,
                            pharmaForm: userData[i].pharmaForm,
                            pharmaQuantity: userData[i].pharmaQuantity,
                            pharmaNotes: userData[i].pharmaNotes,
                            pharmaEntry: userData[i].pharmaEntry,
                            editable: true,
                            durationEditable: true,
                            backgroundColor: userData[i].cal_color,
                            borderColor: '#ffffff',
                            textColor: userData[i].txt_color
                            //error: function() { alert('There was an error loading calendar data.');}
                        });
                    }
                    callback(eventData);
                }
            });
        },
        editable: true,
        draggable: true,
        resizeable: true,
        theme: false,
        selectable: true,
        selectHelper: true,
        unselectAuto: true,
        eventStartEditable: true,
        eventDurationEditable: true,
        eventLimit: true,
        defaultView: 'agendaWeek',
        allDayDefault: false,
        slotMinutes: 15,
        snapMinutes: 15,
        defaultEventMinutes: 30,
        firstHour: 8,
        timezone: deviceTimeZone,
        year: moment.tz(deviceTimeZone).format("YYYY"),
        month: moment.tz(deviceTimeZone).format("M"),
        date: moment.tz(deviceTimeZone).format("DD"),
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        buttonText: {
            month: 'Month',
            agendaWeek: 'Week',
            agendaDay: 'Day'
        });