我使用FullCalender显示日历,并允许用户在日历中创建活动,动态持续时间可从下拉列表中选择。
当用户仅在日历上点击时,我得到的结果只是选择了所需的持续时间。这是正确的。
但问题是当用户点击并继续DRAG选择时间范围时。我不希望用户能够选择超过指定的持续时间,即说5分钟。只有CLICKing选择5分钟,这完全正常。唯一的问题是DRAGing with CLICKing。
我已尝试过FullCalendar文档中提供的各种选项,但没有任何帮助。
感谢任何帮助。在此先感谢。
当前整合位于以下链接到小提琴
https://jsfiddle.net/4h28Lt81/
Jquery如下:
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
defaultView: 'agendaDay',
slotDuration: '00:05:00',
slotEventOverlap: false,
defaultDate: '2016-06-12',
selectable: true,
selectHelper: true,
select: function(start, end) {
var title = prompt('Event Title:');
var eventData;
if (title) {
eventData = {
title: title,
start: start,
end: end
};
$('#calendar').fullCalendar('renderEvent', eventData, true);
}
$('#calendar').fullCalendar('unselect');
},
editable: true,
eventLimit: true, // allow "more" link when too many events
loading: function(bool) {
$('#loading').toggle(bool);
},
eventRender: function(event, el) {
// render the timezone offset below the event title
if (event.start.hasZone()) {
el.find('.fc-title').after(
$('<div class="tzo"/>').text(event.start.format('Z'))
);
}
},
eventClick: function(calEvent, jsEvent, view) {}
});
答案 0 :(得分:1)
我觉得能够点击并拖动您想要参加活动的时间不是问题。除非我在你的问题中遗漏了一些内容。假设用户只需要阻止5分钟段吗?
如果你真的想阻止它拖动,可以通过jQueryUI
禁用它myObject.draggable( 'disable' )
希望这有帮助!