javascript - fullCalendar 未显示正确的结束日期

Question

我正在查看 FullCalendar 官方网站的调试页面。我想安排从 22/09/2015 到 30/09/2015 (dd/mm/yyyy) 的活动。但它只显示从 22/09/2015 到 29/09/2015 的日期 - 缺少 30/09/2015。

这是代码：

$(function() { // document ready
   $('#calendar').fullCalendar({
     header: {
       left: 'prev,next today',
       center: 'title',
       right: 'month,agendaWeek,agendaDay'
     },
     defaultDate: '2014-11-12',
     editable: true,
     eventLimit: true, // allow "more" link when too many events
     events: [
        {
          title: 'Meeting',
          start: '2015-09-22',
          end: '2015-09-30'
        }
     ]
   });  
});

这是输出的图像：

这段代码有什么问题？

score 2 · Accepted Answer

不要将日期视为离散的日子，而应将其视为时间的连续体。日期2015-09-30隐含地给出时间00:00:00，即午夜。这意味着该事件实际上不会延续到 30 日，而是恰好在那天开始时。

这为您提供了一个简单的解决方案。一天后结束活动：

end: '2015-10-01'

或者，从文档中获取：

这是事件结束后的瞬间。例如，如果活动的最后一整天是星期四，则活动的唯一结束时间将是星期五 00:00:00！

score 0 · Accepted Answer

在此处输入图像描述只需添加时间范围 12:00:00 到 24:00:00

    events: [
     {
       title: 'Anniversary',
       start: '2018-01-21T12:00:00',
       end: '2018-01-23T24:00:00'
     }
    ]

score 0 · Accepted Answer

您可以在 laravel中添加结束日期的日期

events : [
        @foreach($reservations as $reservation)
           {
            title :'{{ $reservation->name }},
            start :'{{ $reservation->start }}',
            end :  '{{ $reservation->end->addDays() }}',
            allDay:true,
           },
        @endforeach
],

因为在 Docs fullcalendar

end：如上所述，这是事件结束的日期。换句话说，事件持续到这个截止时间点。此值指定事件的排他结束。由于活动预计不会超过给定的结束日期，因此也可能被描述为不包括在内

同样，如果 allDay 未明确设置为 true 并且 end 为 2018-09-07，则在内部这被识别为 2018-09-07T00:00:00。就是那个时间点，在 2018-09-06 的最后部分和 2018-09-07 的开始。此外，这可能被解释为 2018-09-06T23:59:59 或 2018-09-07T00:00:00。

Fullcalender 文档链接

score 0 · Accepted Answer

根据库规范，它从事件文档中排除最后一天以供参考是 https://github.com/fullcalendar/fullcalendar/issues/2653 https://github.com/fullcalendar/fullcalendar/issues/3679

我的工作包括结束日期是通过使用时刻为它增加一天

   moment(new Date())
      .add(1, 'day')
      .startOf('day')
      .toDate(),

它将采用日期对象并为其添加一天

var date = new Date(); new Date(date.setDate(date.getDate() + 1))

score 0 · Accepted Answer

尝试

    $('#calendar').fullCalendar({
        nextDayThreshold:'00:00', // not 00:00:00
   [...]

score 0 · Accepted Answer

您可以尝试使用 date_add()。

$date=date_create("2013-03-15");
date_add($date,date_interval_create_from_date_string("1 day"));

然后应用 php 来回显新日期。

end: '<?php echo date_format($date,"Y-m-d"); ?>'

score 0 · Accepted Answer

确定显示正确的结束时间：

整天喜欢：从 23-09-2015 到 30-09-2015 (dd-mm-yyyy)
在“结束”添加一天

$('#calendar').fullCalendar({    
  events: [
    {
      title: 'Meeting',
      start: '2015-23-09',
      end: '2015-01-10'
    }
  ]
}

对于 mySql 查询，添加这样的一天：

DATE_ADD(end_date, INTERVAL 1 DAY)

对于一天中的部分时间，例如：从 23-09-2015 12:00:00 到 30-09-2015 15:30:00 (dd-mm-yyyy hh:mm:ss)
您需要设置完整日历“nextDayThreshold”参数，因此它将从 00:00 开始一天

$('#calendar').fullCalendar({    
  nextDayThreshold:'00:00:00',
  events: [
    {
      title: 'Meeting',
      start: '2015-23-09T12:00:00',
      end: '2015-30-09T15:30:00'
    }
  ]
}

javascript - fullCalendar 未显示正确的结束日期

7 回答 7

Related

Reference