在完整日历 (v5) 中不使用 24 小时时间格式

Not working 24h time format in Full calendar (v5)

我不明白这个问题。 在官方文档中找到了解决方案。 我有版本 5,它显示 AM、PM 格式。我需要将其更改为 24 小时。 我找到了其他解决方法,但不适用于版本 5。

        document.addEventListener('DOMContentLoaded', function() {
            var calendarEl = document.getElementById('calendar');
            var calendar = new FullCalendar.Calendar(calendarEl, {
                height: 1100,
                initialView: 'timeGridWeek',
                initialDate: '2021-06-18', // will be parsed as local
                allDaySlot: false,
                eventsTimeFormat: {

                    hour: '2-digit',
                    minute: '2-digit',
                    second: '2-digit',
                    meridiem: false
                },
                eventSources: [
                    // Events
                    {

                        events: [
                            {
                                title  : 'SimulatorName',
                                start  : '2021-06-18T12:30:00',
                                end: '2021-06-18T14:30:00',
                            },
                            {
                                title  : 'SimulatorName',
                                start  : '2021-06-13T12:30:00',
                                end: '2021-06-13T14:30:00',
                            },
                            {
                                title  : 'SimulatorName',
                                start  : '2021-06-13T15:30:00',
                                end: '2021-06-13T19:30:00',
                            },
                          
                        ],
                        color: 'silver',
                        textColor: 'black',
                        borderColor: 'black',
                        eventTimeFormat: { // like '14:30:00'
                            hour: '2-digit',
                            minute: '2-digit',
                            second: '2-digit',
                            meridiem: false
                        },
                    },

                ],
            });
            calendar.render();
        });

eventTimeFormat,不是eventsTimeFormat。 - 根据 https://fullcalendar.io/docs/eventTimeFormat 。始终仔细检查您的工作。

同样要获得 24 小时显示,再次根据文档(https://fullcalendar.io/docs/date-formatting,链接自 eventTimeFormat 文章),您需要指定 hour12: false

eventTimeFormat: {
  hour: "2-digit",
  minute: "2-digit",
  hour12: false
},

将为您提供传统的 24 小时显示 - 例如3.30pm 将显示为 15:30.

现场演示:https://codepen.io/ADyson82/pen/VwpNRdo