0

我刚刚开始使用 jQuery fullcalendar http://arshaw.com/fullcalendar/，我遇到了一个奇怪的问题。我从点击功能启动日历，第一次打开日历时它很好并打开了 1 个日历。但是，如果我再次单击，它会添加 1，我现在有 2 个日历。每次我单击它时都会发生这种情况，它每次都会添加 1 个日历。是否有一些我必须添加的选项来重新初始化日历。我能看到的唯一选项是“渲染”选项，但无法弄清楚如何使用它。谢谢

更新：新代码更新

$(function() {
    $('#calhead1').on("click", function(){

        $("#msgcontent, #msgcontent2, #main, #msgtest").hide(1000);
        $("#cal").show();
    });
});
    // Start Calendar Script //

    $(function() {

            var date = new Date();
            var d = date.getDate();
            var m = date.getMonth();
            var y = date.getFullYear();

            $('#cal').fullCalendar({

                header: {
                    left: 'prev,next today',
                    center: 'title',
                    right: 'month,basicWeek,basicDay'
                },
                editable: true,
                theme: true,
                width: 760,
                height: 470,
                events: [
                    {
                        title: 'All Day Event',
                        start: new Date(y, m, 1)
                    },
                    {
                        title: 'Long Event',
                        start: new Date(y, m, d-5),
                        end: new Date(y, m, d-2)
                    },
                    {
                        id: 999,
                        title: 'Repeating Event',
                        start: new Date(y, m, d-3, 16, 0),
                        allDay: false
                    },
                    {
                        id: 999,
                        title: 'Repeating Event',
                        start: new Date(y, m, d+4, 16, 0),
                        allDay: false
                    },
                    {
                        title: 'Meeting',
                        start: new Date(y, m, d, 10, 30),
                        allDay: false
                    },
                    {
                        title: 'Lunch',
                        start: new Date(y, m, d, 12, 0),
                        end: new Date(y, m, d, 14, 0),
                        allDay: false
                    },
                    {
                        title: 'Birthday Party',
                        start: new Date(y, m, d+1, 19, 0),
                        end: new Date(y, m, d+1, 22, 30),
                        allDay: false
                    },
                    {
                        title: 'Click for Google',
                        start: new Date(y, m, 28),
                        end: new Date(y, m, 29),
                        url: 'http://google.com/'
                    }
                ]
            });

            });

    // End Calendar Script //
4

2 回答 2

2
  1. jQuery live-function 已被弃用，使用 .on()
  2. 在点击事件之外初始化您的日历，并在点击时显示和隐藏它。
于 2012-12-11T15:04:26.127 回答
2

调用该fullCalendar函数旨在创建一个新日历，以便您的脚本完全按照预期执行。您只需将该功能移到您的点击事件处理程序之外。

我还建议live从新on方法转移到 jQuery 现已弃用live。

您的新代码如下所示：

$(function() {

    $('#cal').fullCalendar({

        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,basicWeek,basicDay'
        },
        editable: true,
        theme: true,
        width: 760,
        height: 470,
        events: [
            {
                title: 'All Day Event',
                start: new Date(y, m, 1)
            },
            {
                title: 'Long Event',
                start: new Date(y, m, d-5),
                end: new Date(y, m, d-2)
            },
            {
                id: 999,
                title: 'Repeating Event',
                start: new Date(y, m, d-3, 16, 0),
                allDay: false
            },
            {
                id: 999,
                title: 'Repeating Event',
                start: new Date(y, m, d+4, 16, 0),
                allDay: false
            },
            {
                title: 'Meeting',
                start: new Date(y, m, d, 10, 30),
                allDay: false
            },
            {
                title: 'Lunch',
                start: new Date(y, m, d, 12, 0),
                end: new Date(y, m, d, 14, 0),
                allDay: false
            },
            {
                title: 'Birthday Party',
                start: new Date(y, m, d+1, 19, 0),
                end: new Date(y, m, d+1, 22, 30),
                allDay: false
            },
            {
                title: 'Click for Google',
                start: new Date(y, m, 28),
                end: new Date(y, m, 29),
                url: 'http://google.com/'
            }
        ]
    });
    $('#calhead1').on("click", function(){

                    $("#msgcontent, #msgcontent2, #main, #msgtest").hide(1000);
                    $("#cal").show();
                    var date = new Date();
                    var d = date.getDate();
                    var m = date.getMonth();
                    var y = date.getFullYear();
    });

});
于 2012-12-11T15:13:18.230 回答