Jquery Fullcalendar:为什么日历在页面上出现两次?

Jquery Fullcalendar:为什么日历在页面上出现两次?,jquery,fullcalendar,Jquery,Fullcalendar,我将Fullcalendar用于jQuery,由于某些原因,该日历在页面上出现了两次。这不是在同一页面上有两个fullcalendar实例的问题 相反,在第一个日历的底部,有第二个相同的日历 我确认我的页面中只有一个#calendar div,所以我相信这个错误与调用fullcalendar.js的my.js有关 非常感谢您的帮助 JS代码: jQuery('#calendar').fullCalendar({ year: jQuery.today.getFullYear()

我将Fullcalendar用于jQuery,由于某些原因,该日历在页面上出现了两次。这不是在同一页面上有两个fullcalendar实例的问题

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

我确认我的页面中只有一个#calendar div,所以我相信这个错误与调用fullcalendar.js的my.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:


好的,经过一周的bug测试,我发现了这个jQuery插件:

一次

一旦应用到#calendar div before.fullcalendar,问题就解决了,只渲染了一个日历

工作代码:

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

我最近遇到了同样的问题,并尝试了once()jQuery插件,但它对我不起作用。但是,我重新下载了未缩小的源代码,并在initialRender方法中添加了以下行作为该方法的第一行,它解决了我的重复日历方法

element.html(“”)

我猜我的问题是因为我在下拉更改中重新初始化日历,而没有刷新页面,这似乎是js代码不断地将日历附加到现有的div中,而没有清除现有的日历。

添加
a.html(“”)在缩小版中运行
f()

我在一个对话框中打开了我的日历,每次我点击一个按钮打开,就会有另一个日历。
经过一番阅读,我找到了使用--
.fullCalendar('destroy')
——这样你就不需要编辑插件了。
现在,在关闭对话框并重新打开时,只会显示一个日历。

这应该可以做到这一点

因此类似于@netefficiency(使用one而不是one):


$(“#calendar”).one('calendar').fullCalendar({…})

你能发布相关的html和javascript吗?我在fullCalendar调用中有很多代码,希望会有一个通用的原因。我会尽量减少问题的代码。很可能“相当多的代码”是问题的一部分。另外,您还有哪些
fullCalendar
调用(带有用于操作的字符串参数)?@justkt-I添加到fullCalendar的另一个调用的代码上方,它位于同一页面的日期选择器调用中。我在dayClick中注释掉了所有代码,但仍然存在双日历问题。此外,当我在datepicker中单击某一天时,第一个fullcalendar将按预期更改为该天,但第二个fullcalendar将在其打开的同一天保持不变。
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;
          }
      });
jQuery('#calendar').once('calendar').fullCalendar({