jquery - 按钮单击的 Fullcalendar gotoDate 方法

问题描述

使用 Fullcalender.io，我可以很好地渲染日历，还可以使用 gotoDate 方法立即跳到 2010 年。但是，我似乎无法使用 gotoDate 方法跳到另一个日期（在这种情况下为 2018 年）单击按钮。如何正确调用此方法？

<html lang='en'>
  <head>
    <meta charset='utf-8' />
    <script>

      document.addEventListener('DOMContentLoaded', function() {
        var calendarEl = document.getElementById('calendar');
        var calendar = new FullCalendar.Calendar(calendarEl, {
          initialView: 'dayGridMonth'
        });
        calendar.render();
        calendar.gotoDate('2010-01-01');
      });

    </script>
  </head>
  <body>
  <button class="testbut" id="testbut">Skip to 2018</button>
    <div id='calendar'></div>
    
    <script>
       $(document).ready(function(){
         $('.testbut').click(function(){
           $("#calendar").fullCalendar("gotoDate","2018-01-01");
         });
       });
    </script> 
    
    
  </body>
</html>

这是 JSFiddle https://jsfiddle.net/az4h31py/1/

标签： jqueryfullcalendar

尝试这个。只需在calendar全局范围内声明变量并使用它来随时调用函数。

https://jsfiddle.net/syact05p/

<!DOCTYPE html>
<html lang='en'>
  <head>
    <meta charset='utf-8' />
    <script>
    var calendar
      document.addEventListener('DOMContentLoaded', function() {
        var calendarEl = document.getElementById('calendar');
        calendar = new FullCalendar.Calendar(calendarEl, {
          initialView: 'dayGridMonth'
        });
        calendar.render();
        calendar.gotoDate('2010-01-01');
      });

    </script>
  </head>
  <body>
  <button class="testbut" id="testbut">Skip to 2018</button>
    <div id='calendar'></div>
    
    <script>
       $(document).ready(function(){
         $('.testbut').click(function(){
           calendar.gotoDate('2018-01-01');
         });
       });
    </script> 
    
    
  </body>
</html>

jquery - 按钮单击的 Fullcalendar gotoDate 方法

问题描述

解决方案

推荐阅读