2
如何僅使用FullCalendar顯示08:00-12:00和13:00-18:00之間的時間,而不是周視圖中的全部24小時?我試過this solution on SO,但我無法讓它工作。僅顯示周視圖中的特定時間範圍
如何僅使用FullCalendar顯示08:00-12:00和13:00-18:00之間的時間,而不是周視圖中的全部24小時?我試過this solution on SO,但我無法讓它工作。僅顯示周視圖中的特定時間範圍
businessHours
可能會讓你到你想去的地方。從v2.9.1
開始,您可以指定多個小時段。
$('#calendar').fullCalendar({
defaultView: 'agendaWeek',
businessHours: [{
dow: [0, 1, 2, 3, 4, 5, 6], // Maybe not 0,6? Sunday,Saturday
start: '08:00',
end: '12:00'
}, {
dow: [0, 1, 2, 3, 4, 5, 6], // Maybe not 0,6? Sunday,Saturday
start: '13:00',
end: '18:00'
}]
});
@import url('https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.0.1/fullcalendar.min.css');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.0.1/fullcalendar.min.js"></script>
<div id="calendar"></div>
它仍然允許創建或移動到非業務時間事件,但給人以視覺上指示的「不正常小時」的日曆。
你也可以從某種看法刪除行這樣
$('#calendar').fullCalendar({
defaultView: 'agendaWeek',
viewRender: function(view, element) {
if (view.name.substr(0, 6) === 'agenda') {
$(element).find('div.fc-slats table tr[data-time]').filter(function() {
var _t = $(this).data('time');
/* find times not in the ranges we want */
return ((_t >= '08:00' && _t <= '12:00') || (_t >= '13:00' && _t <= '18:00')) === false;
}).each(function() {
$(this).hide(); /* hide the rows */
});
}
}
});
@import url('https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.0.1/fullcalendar.min.css');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.0.1/fullcalendar.min.js"></script>
<div id="calendar"></div>
這種方法可能是脆弱但如果渲染的變化得到FullCalendar製造。
謝謝你,你是最好的!這正是我需要的!向你呼喊:) – Rubberduck1337106092