javascript - 更改 View 时 Fullcalendar eventClick 不起作用

Question

我在带有phonegap的应用程序中使用fullcalendar。我有两个外部按钮可以更改 View (月或周)，默认 View 是月。

nova.touch.bindClick("#btn_week", function() {
        $('#calendar').fullCalendar('changeView', 'basicWeek');
        $('#calendar').fullCalendar( 'render' );            
    });

nova.touch.bindClick("#btn_month", function() {
        //$('#calendar_week').hide();
        $('#calendar').fullCalendar('changeView', 'month');
        $('#calendar').fullCalendar('render');
    });

我有事件和事件点击:

$('#calendar').fullCalendar({
                theme: false,
                defaultView: 'month',
                columnFormat: 'ddd',
                firstDay: 1,
                editable: true,
                height: $('#calendar_content').height(),
                header: {
                        right: 'today',
                        left: 'title'
                        //center: 'month,basicWeek'
                    },
                events: [                       
                    {

                        title: 'N',
                        start: new Date(y, m, d-8)
                    },
                    {

                        title: 'L',
                        start: new Date(y, m, d+1)
                    },
                    {

                        title: 'L2',
                        start: new Date(y, m, d-15)
                    }

                ],

                eventClick: function(calEvent, jsEvent, view) {

                    alert('Event: ' + calEvent.title);
                    alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY);
                    alert('View: ' + view.name);

                   $('#calendar').fullCalendar('updateEvent', calEvent);

                }

第一次，事件点击效果很好。我单击事件并看到警报。但是，当我使用外部按钮更改 View 时，如果我触摸/单击事件，则不会显示警报。

fullcalendar版本是:fullcalendar-2.3.2

Answer 1

Phonegap 不适用于全日历中的事件。我找到了解决方案。

我创建了一个函数，它使用不同的参数(日期、 View 类型)创建日历，并将触摸事件放入此函数中(如果放在此函数之外，则事件不起作用)，当我更改日历或带有外部按钮的 View 中的日期，我销毁日历并使用新的日期和 View 再次创建。

这是创建日历函数的代码:

openCalendar: function(view, date_open, data){

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

    $('#calendar').fullCalendar({           
        theme: false,
        defaultView: view,
        columnFormat: 'ddd',
        defaultDate: date_open,
        firstDay: 1,
        editable: true,
        height: $('#calendar_content').height(),

        header: {
                right: 'today',
                left: 'title'
                //center: 'month,basicWeek'
            },
        events: [
            {
                title: 'E',
                start: new Date(y, m, 1)
            },
            {
                title: 'N',
                start: new Date(y, m, d-5)
            },
            {

                title: 'L',
                start: new Date(y, m, d-3, 16, 0),
                allDay: false
            },
            {
                title: 'R',
                start: new Date(y, m, d+4, 16, 0),
                allDay: false
            },
            {

                title: 'NS',
                start: new Date(y, m, d-7)
            },
            {

                title: 'N',
                start: new Date(y, m, d-8),
                imagen: 'yes'
            },
            {

                title: 'L',
                start: new Date(y, m, d+1)
            },
            {

                title: 'L2',
                start: new Date(y, m, d-15)
            }

        ]
    });

     nova.touch.bindClick(".fc-event-container",function(){
         me.firstDialog(); //open dialog
        });

     $('.fc-day').on( 'touchstart', function ( startEvent ) {           
         me.firstDialog();
    });

},

在最初的通话中，我这样做:

var date = new Date();
me.openCalendar('month', date);

如果我改变一些东西:

 nova.touch.bindClick("#btn_week", function() {

        var current_date = $('#calendar').fullCalendar('getDate');            
        $('#calendar').fullCalendar('destroy');         
        me.openCalendar('basicWeek', current_date);

    });

    nova.touch.bindClick("#btn_month", function() {

        var current_date = $('#calendar').fullCalendar('getDate');
        $('#calendar').fullCalendar('destroy');
        me.openCalendar('month', current_date);            
    });

当我触摸某个事件时，对话框或警报会正确打开。