刷新全日歷時顯示相同的月/周/日

Question

我正在使用 fullcalendar 插件來顯示各種事件。

我的問題是當我更改正在查看的月/周，然后刷新時，我會回到當前的月/周，當我想留在我之前查看的同一個月/周時。 即如果現在是八月，我回到七月，然后刷新，我希望頁面顯示七月而不是八月的日歷。

下面給出了為指定問題提供工作日歷的代碼。 請注意，我知道此日歷無法完全工作（無法添加事件等），但將其另存為 index.html 並打開它會顯示刷新后無法在上一個視圖中打開的問題。

 <!DOCTYPE html> <html> <head> <title>Jquery Fullcalandar Integration with PHP and Mysql</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.css" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.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/jqueryui/1.12.1/jquery-ui.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.js"></script> <script> $(document).ready(function() { var calendar = $('#calendar').fullCalendar({ allDaySlot: false, editable:true, header:{ left:'prev,next today', center:'title', right:'month,agendaWeek,agendaDay' }, events: [{"id":1,"title":"one","start":"2019-08-11 00:00:00","end":"2019-08-12 00:00:00", 'color': 'Fuchsia'}], selectable:true, selectHelper:true, select: function(start, end, allDay) { var title = prompt("Enter Event Title"); if(title) { var start = $.fullCalendar.formatDate(start, "Y-MM-DD HH:mm:ss"); var end = $.fullCalendar.formatDate(end, "Y-MM-DD HH:mm:ss"); $.ajax({ url:"insert.php", type:"POST", data:{title:title, start:start, end:end}, success:function() { calendar.fullCalendar('refetchEvents'); alert("Added Successfully"); } }) } }, editable:true, eventResize:function(event) { var start = $.fullCalendar.formatDate(event.start, "Y-MM-DD HH:mm:ss"); var end = $.fullCalendar.formatDate(event.end, "Y-MM-DD HH:mm:ss"); var title = event.title; var id = event.id; $.ajax({ url:"update.php", type:"POST", data:{title:title, start:start, end:end, id:id}, success:function(){ calendar.fullCalendar('refetchEvents'); alert('Event Update'); } }) }, eventDrop:function(event) { var start = $.fullCalendar.formatDate(event.start, "Y-MM-DD HH:mm:ss"); var end = $.fullCalendar.formatDate(event.end, "Y-MM-DD HH:mm:ss"); var title = event.title; var id = event.id; $.ajax({ url:"update.php", type:"POST", data:{title:title, start:start, end:end, id:id}, success:function() { calendar.fullCalendar('refetchEvents'); alert("Event Updated"); } }); }, eventClick:function(event) { if(confirm("Are you sure you want to remove it?")) { var id = event.id; $.ajax({ url:"delete.php", type:"POST", data:{id:id}, success:function() { calendar.fullCalendar('refetchEvents'); alert("Event Removed"); } }) } }, }); }); </script> </head> <body> <br /> <h2 align="center"><a href="#">Jquery Fullcalandar Integration with PHP and Mysql</a></h2> <br /> <div class="container"> <div id="calendar"></div> </div> </body> </html>

我希望在某處添加一個屬性（大概在第 14 行var calendar = $('#calendar').fullCalendar({ ) 之后，這樣在刷新后，我會在我之前所在的月份/周結束。

Answer 1

您可以添加此代碼來解決您的問題

$(document).on('click', '.fc-next-button,.fc-prev-button', function () {
 localStorage.setItem('savedMonth',$('#calendar').fullCalendar('getView').intervalStart._d);
});
if(localStorage.getItem('savedMonth')!=null){
$('#calendar').fullCalendar('gotoDate',localStorage.getItem('savedMonth'));
}

或者您可以使用 cookie 而不是本地存儲來執行此操作

刷新全日歷時顯示相同的月/周/日

問題描述

1 個解決方案

解決方案1
3 已采納 2019-08-12 20:24:46

刷新全日歷時顯示相同的月/周/日

問題描述

1 個解決方案

解決方案1 3 已采納 2019-08-12 20:24:46

解決方案1
3 已采納 2019-08-12 20:24:46