将鼠标点击时选择的时间从30分钟更改为一小时



现在当我在周视图中点击日历时,它默认为30分钟插槽。我可以延长,但总是从30分钟开始。

09:30-10:00
12:00-12:30
17:30-18:00

我想将其更改为默认值为一小时。理想情况下,当我点击日历时,它会以一个60分钟的时间段开始。

09:30-10:30
12:00-13:00
17:30-18:30

有一个名为defaultTimedEventDuration的选项,但我从未成功使用它…

但是,您可以在单击日历后修改事件:在select方法之后,您只需计算事件的结束日期并将事件render:

select: function(start, end) {
    end =  $.fullCalendar.moment(start);
    end.add(1, 'hours');
    $('#calendar').fullCalendar('renderEvent',
    {
        start: start,
        end: end,
        allDay: false
        },
        true // stick the event
    );
    $('#calendar').fullCalendar('unselect');
}

这是一个工作的jsFiddle。

编辑:计算结束日期,我使用FullCalendar v2附带的moments .js。但是Javascript Date()也可以。

在文件fullcalendar.min.js在最后一行找到

slotDuration:"00:30:00"

改变

slotDuration:"01:00:00"

摘自文档

snapDuration: "01:00:00"

如果你将forceEventDuration设置为true,那么你就可以为defaultTimedEventDuration设置一个时间。添加以下代码,它将设置1小时作为事件的默认值。

$('#calendar').fullCalendar({
  forceEventDuration : true,
  defaultTimedEventDuration : "01:00:00"
});

来源:forceEventDurationdefaultTimedEventDuration

您也可以在select方法中修改持续时间,如下所示

select: function(arg) {
          calendar.addEvent({
          title: title,
          start: arg.start,
          end: arg.end.getMinutes() +50,
          allDay: arg.allDay
          });
       calendar.unselect()
      }

相关内容

  • 没有找到相关文章

最新更新