Question

我将Fullcalendar用于个人项目（针对家庭成员），并且在多次单击事件后发现奇怪的行为，我解释了

我的事件点击打开模式以对其进行编辑

eventClick: function(event, resourceObj) {
        //alert(resourceObj.title);
        let evt = {};
        let end = '';
        if(event.end) {
            evt['end'] = event.end.format();
        } else {
            evt['end'] = event.start.format();
        };
        evt['title'] = event.title;
        evt['resourceId'] = event.resourceId;
        evt['description'] = event.description;
        evt['color'] = event.color;
        evt['id'] = event.id;
        evt['start'] = event.start.format();
        openModal(evt);
        // mise a jour d'un event
        $('#formModal #newEventSubmit').on('click', function() {
            updateDate();
            if ($('#newEventTitle').val()) {
                var eventData = {
                    start: $('#newEventStart').val(),
                    end: $('#newEventEnd').val(),
                    resourceId: $('#newEventResource').val(),
                    description: $('#newEventDescription').val(),
                    title: $('#newEventTitle').val(),
                    color: $('#newEventColor').val(),
                    id: $('#newEventId').val(),
                    allDay: false
                };
                console.log(eventData);
                if($('#newEventStartH').val() == '' && $('#newEventEndH').val() == ''){
                    eventData['allDay'] = true;
                }
                $('#calendar').fullCalendar('removeEvents', event._id);
                putEvent(eventData, event);
            }
            $('#formModal').find('input').val('');
            $('#formModal').modal('hide');
        });
        // action pour delete un event
        $('#formModal #newEventDelete').on('click', function() {
            $('#calendar').fullCalendar('removeEvents', event._id);
            deleteEvent(evt);
            $('#formModal').modal('hide');
            //$('#calendar').fullCalendar('refetchEvents');

        });

    },

OpenModal =>使用2个按钮创建模态（更新和删除）

当我单击事件时，关闭模式，打开另一个并删除此=>删除是针对所有单击的事件

当我检查网络时，我会用api rest观看所有id删除

你明白吗？

Answer 1

这是因为每次您单击事件时，您都会执行

$('#formModal #newEventSubmit').on('click', function() {

和

$('#formModal #newEventDelete').on('click', function() {

每一个都向模式的“提交”和“删除”按钮添加了新的事件处理功能，以在单击按钮时触发。但是，它不会删除所有以前的事件处理程序。因此，如果单击多个事件，它将为按钮添加越来越多的事件处理程序。然后，当您单击这些按钮之一时，它会立即触发所有附加事件处理程序-例如，这就是为什么您看到很多对delete函数的请求的原因。

一个简单的解决方案是在添加新事件处理程序之前删除以前的事件处理程序。您可以使用jQuery的.off()方法：

$('#formModal #newEventSubmit').off('click').on('click', function() {

和

$('#formModal #newEventDelete').off('click').on('click', function() {

fullcalendar-多次单击后的奇怪行为

1 个答案: