Question

我正在使用Fullcalendar for jQuery，由于某种原因，日历在页面上出现两次。这不是关于在同一页面上有两个fullcalendar实例的问题。

相反，在第一个日历的底部，有第二个相同的日历。

我确认我的页面中只有一个#calendar div，所以错误与调用fullcalendar.js的.js有关。我相信。

任何帮助都非常感激。

JS代码：

jQuery('#calendar').fullCalendar({


        year: jQuery.today.getFullYear(),
        month: jQuery.today.getMonth(),
        date: jQuery.today.getDate(),
        theme: true,
        contentHeight: 1000,
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        defaultView: 'agendaDay',
        dayClick: function(date, allDay, jsEvent, view) {
                           // a lot of custom code
                    }
            });

HTML：

<table><tr><td valign="top" width="700px"><div id="calendar"></div></td></tr></table>

javascript中对fullcalendar的其他调用（这会在同一页面上将#calendar div的div放在div中）：

jQuery('#datepicker_for_calendar').datepicker({
          defaultDate: jQuery.today,
          minDate: jQuery.startDate,
          maxDate: jQuery.endDate,
          inline: true,
          showButtonPanel: true,
          onSelect: function(dateText, inst) {
              var d = new Date(dateText);
              jQuery('#calendar').fullCalendar('gotoDate', d);
              selectedDate = d;
          }
      });

Answer 1

在缩小版本中将a.html('');添加到功能f() 我在一个对话框中打开了我，每次点击按钮打开都会有另一个日历经过一些阅读后，我找到了使用方法 - .fullCalendar('destroy') - 这样您就不需要编辑插件了。
现在，关闭对话框并重新打开后，只显示一个日历。

Answer 2

我最近遇到了同样的问题并尝试了一下（）jQuery插件，这对我来说不起作用。但是，我重新下载了非缩小源，并在initialRender方法中添加了以下行作为方法的第一行，它解决了我的重复日历方法。

element.html('');

我的猜测是我的问题来自这样一个事实：我在下拉更改时重新初始化日历而没有刷新页面，这似乎是js代码不断地将日历附加到现有div而不清除现有日历

Answer 3

好的，经过长达一周的bug测试后，我发现了这个jQuery插件：

一次（）

http://plugins.jquery.com/project/once

在.fullcalendar之前应用于#calendar div后，问题解决了，只渲染了一个日历。

工作代码：

jQuery('#calendar').once('calendar').fullCalendar({

... }）

Answer 4

这应该http://api.jquery.com/one完成。

类似于@netefficacy（使用一个而不是一次）：

$('#calendar').one('calendar').fullCalendar({...})

Fullcalendar：为什么日历在页面上出现两次？

4 个答案: