Javascript 未捕获类型错误：$（…）。尝试删除事件源时fullCalendar不是函数

我正试图让fullCalendar删除它以前的事件源，并在buttonclick上重新绑定到一个新的事件源。我已经寻找答案好几个小时了，但我发现的解决方案似乎都不管用

我有一个页面，是一个下拉菜单和按钮上面的完整日历校准。在“加载”页面上，日历将从数据库中加载所有事件列表，而不会出现问题。我试图实现的是一个客户端过滤器，它只会在单击按钮后显示我在下拉列表中选择的名称

将名称过滤到一个新的JSON数组中的函数工作得很好，我的问题是，根据标题，我得到了一个控制台错误，阻止我删除原始源代码并重新绑定新数组

这是我的密码：

CSHTML:

<div class="member-filter-section">
        <div class="member-filter-container">
            <div class="staff-container">
                <p class="staff-name">Staff Member:</p>
                <div class="staff-select">
                    <select id="staff_list" multiple="multiple">
                        @foreach (var u in users)
                        {
                            <option value="@u.UserId">@u.UserName</option>
                        }
                    </select>
                </div>
            </div>
            <div class="branch-container">
                <p class="branch-name">Branch:</p>
                <div class="branch-select">
                    <select id="branch_list">
                        <option>City Center</option>
                        <option>Foxrock</option>
                        <option>Dalkey</option>
                    </select>
                </div>
            </div>
            <div id="filter" class="nav_button filter-button">Select</div>
        </div>
    </div>
    <div class="calendar-wrapper">
        <div id="calendar" class="calendar-body"></div>
    </div>

---

所以我想fullCalendar小部件可能会丢失。在填充日历之前，请尝试将DOM元素存储在变量中（如

$calendar=$（'#calendar'）

），并在rebindCalendar函数中重用它。

因此，我想fullCalendar小部件可能会丢失。在填充日历之前，请尝试将DOM元素存储在一个变量中（如

$calendar=$（“#calendar”）

），并在rebindCalendar函数中重用它。

您的代码在以下情况下运行良好：

---

如果您的

#calendar

不存在，则表示它以某种方式从DOM中删除，或者它的ID被更改，或者您试图从另一个文档（在iframe中）对它进行操作，或者$not jQuery，或者fullCalendar被函数破坏

您的代码在这种情况下运行良好：

---

如果您的

#calendar

不存在，则表示它以某种方式从DOM中删除，或者它的ID被更改，或者您试图从另一个文档（在iframe中）对它进行操作，或者$not jQuery，或者fullCalendar被函数破坏

@rocinate i fullcalendar的脚本引用是remove，$（“#calendar”）在rebindCalendar中是否包含任何元素？@BassT我真的不确定？我对Javascript非常陌生，只是在阅读文档和我所看到的其他人实现的onlineGo，并添加console.log（$（“#calendar'）.length）作为rebindCalendar函数的第一行。应该是1。@BassT谢谢你的帮助。是的，长度是1@rocinate我想fullcalendar的脚本引用是remove，，$（“#calendar”）在rebindCalendar中是否包含任何元素？@BassT我真的不确定？我对Javascript非常陌生，只是在阅读文档和我所看到的其他人实现的onlineGo，并添加console.log（$（“#calendar'）.length）作为rebindCalendar函数的第一行。应该是1。@BassT谢谢你的帮助。是的，长度是1

// The ajax to return a correct JSON array
        var eventsFeed = function (start, end, timezone, callback) {
            var id = @agentId;
            $.ajax({
                type: "POST",
                url: "/SystemManagement/Viewings/GetCalendarEventListings",
                data: { 'agentId' : id ,'start' : start.format(), 'end' : end.format()},
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(data) {
                    var events = [];
                    $.each(data,
                        function(obj) {
                            var eventObject = data[obj];
                            events.push({
                                title: eventObject.Title,
                                start: eventObject.StartTime,
                                end:  eventObject.EndTime,
                                id: eventObject.Id,
                                userId: eventObject.UserId,
                                color: eventObject.AppointmentColour,
                                attendee: eventObject.Attendee,
                                location: eventObject.Location,
                                type: eventObject.AppointmentType
                            });
                        });
                    globalEvents = events;
                    callback(events);
                    events = [];
                },
                error: function() {
                    console.log('Error');
                }
            });
        }

        $(document).ready(function () {
                $('#staff_list').chosen();
                $('#branch_list').chosen();

                // Gets the JSON array to populate the calendar on page load
                $('#calendar').fullCalendar({
                    defaultView: 'agendaDay',
                    header: {
                        left: 'prev,next, today',
                        center: 'title',
                        right: 'month,agendaWeek,agendaDay'
                    },
                    height: 850,
                    events: eventsFeed,
                    eventClick: function(calEvent) {
                        buildModal(calEvent.type,calEvent.location,calEvent.attendee,calEvent.color, calEvent.start, calEvent.end);
                        modal.style.display = "block";
                    }
                });

                $('#filter')
                   .on('click',
                       function() {

                           var selectedStaffIds = $("#staff_list").val();
                           var filteredEvents = [];

                           globalEvents.forEach(function(obj) {
                               if (checkIfIdIsSelected(selectedStaffIds, obj.userId)) {
                                   filteredEvents.push(obj);
                               }
                           });
                           console.log(filteredEvents);
                           rebindCalendar(filteredEvents);
                           filteredEvents.length = 0;
                       });

                function checkIfIdIsSelected(staffId, objectId) {
                    return staffId.indexOf(objectId) > -1;
                }

                function rebindCalendar(eventsArray) {
                    $('#calendar').fullCalendar('removeEventSource', eventsFeed);
                    $('#calendar').fullCalendar('addEventSource', eventsArray);
                }