javascript - 为什么我的函数不使用新点击的新参数重新运行？

Question

我有四个按钮，用于填充 HTML 中的共享目标框。每个按钮都会向通用处理程序发送不同的参数(“类型”)，该处理程序运行通用函数 CalChoice，该函数使用自定义 URL(基于类型参数)触发 API。第一次可以正常工作，但任何单击另一个按钮都不会使用新参数再次触发该函数。我已经运行了计数器和警报来证明我的点击正在访问该函数，但在第一次之后，我可以看到控制台中的 XHR 回调没有改变。 (我想我不能排除该函数使用旧参数重新运行，因为内容不会改变，但我没有看到丝毫打嗝。)在下面的代码中，您将找到点击处理程序和func 调用位于所有内容下方的最底部。

为什么会失败？

 function CalChoice(type) {

    if ( type == "getArt")  {
    $useURL = "my cal source here 1"
        } else if  ( type == "getNature") {
    $useURL = "my cal source here 2"
        } else if  ( type == "getFitness") {
    $useURL = "my cal source here 3"
        } else if  ( type == "getLectures") {
    $useURL = "my cal source here 4"
        }

    $('.amu-calendar').fullCalendar({

        googleCalendarApiKey: 'XXXXXX',  //our API key
        events: { googleCalendarId: $useURL
        },

        eventBackgroundColor: '#65378e',

        defaultView: 'vertWeek',

        header: {
                    left: "title",
                    center: "vertWeek month",
                    right:  "prev next"
                    },

        dayRender: function( date, cell ) { 
            // Get the current view     
            var view = $('.amu-calendar').fullCalendar('getView');

            // Check if the view is the new vertWeek - 
            // in case you want to use different views you don't want to mess with all of them
            if (view.name == 'vertWeek') {


                // Hide the widget header - looks wierd otherwise
                $('.fc-widget-header').hide();
                $('.fc-day-header').hide();

                // $('div#calendar.fc.fc-ltr.ui-widget').find('div.fc-toolbar').find('div.fc-center').html( "<a href='#switchView'>Change View</a>" );


                // Remove the default day number with an empty space. Keeps the right height according to your font.
                $('.fc-day-number').html('<div class="fc-vertweek-day">&nbsp;</div>');

                // Create a new date string to put in place  
                var this_date = date.format('ddd, MMM Do');

                // Place the new date into the cell header. 
                cell.append('<div class="fc-vertweek-header"><div class="fc-vertweek-day">'+this_date+'</div></div>');

            }
        },
        theme: true,
        themeButtonIcons: true,
        eventClick: function(gcalEvent, jsEvent, view) {
            gcalEvent.preventDefault ? gcalEvent.preventDefault() : gcalEvent.returnValue = false;  //IE8 does not recognize preventDefault so use returnvalue=false
            var eid = gcalEvent.id;
            var etitle = gcalEvent.title;
            //var eurl = gcalEvent.url;
            //var estart = $.fullCalendar.formatDate(gcalEvent.start, 'MMMM d'+', '+'h:mm tt ');
            //var eend = $.fullCalendar.formatDate(gcalEvent.end, 'h:mm tt');
            var elocation = gcalEvent.location;
            var edescription = gcalEvent.description;
            var eallday = gcalEvent.allDay;
            $('div.title-d').html(etitle);
            //$('div.datetime-d').html(estart + "-" +eend);
            $('div.location-d').html(elocation);
            $('div.description-d').html(edescription);
            $('div.framer').css({'background' : 'rgb(234,191,73)'});    // and do the same for the detail framer                    
            gcalEvent.preventDefault ? gcalEvent.preventDefault() : gcalEvent.returnValue = false;  //IE8 does not recognize preventDefault so use returnvalue=false
            return false;
        }
    });
}
//MY HANDLER

$(".accordionButton").click(function(event) {                                       //amu-calendar
    event.stopPropagation();//tried this, does not help
    var type = $(this).attr('id');
    console.log("The " + type + " button was clicked." ) //this always works but...
    CalChoice(type);// a counter in this func does increment, yet it appears it is not running with the new type...no new result.
});

Answer 1

函数调用没有太大问题，因为参数是正确的，但 fullCalendar 插件在某个时刻是有状态的，并且它将与以前的日历一起使用。您需要先销毁日历才能创建另一个日历。

$('.amu-calendar').fullCalendar('destroy');

另一种方法是删除 eventsObject:

$('.amu-calendar').fullCalendar('removeEvents');
$('.amu-calendar').fullCalendar('addEventSource' , { googleCalendarId : 'newEventURL' });