Fullcalendar 重复插入和删除答案

【问题标题】：Fullcalendar duplicate insert and deleteFullcalendar 重复插入和删除
【发布时间】：2019-06-30 01:33:26
【问题描述】：

我正在使用 Fullcalendar v4。当我选择一个事件时，它会显示一个包含有关该事件的一些信息的模式。如果我点击离开模式，它就会消失。但是，如果我在此之后删除另一个事件，它会删除这两个事件。我之前点击过的所有事件都会发生这种情况。因此它可以一次删除多个事件。

当我第一次将事件插入数据库时，它很好。但是当我第二次这样做时，插入脚本被调用了两次。当我插入第三个事件时，它被调用了三次。

我找不到从记忆中清除旧动作的方法。我尝试调用 calendar.unselect() 方法，但无法正常工作。

这是我的选择和删除代码。

eventClick: function(info) {
    var event = info.event;
    $.ajax({
        url:"select.php",
        type:"POST",
        data: { id: event.id },
        success: function(data) {
            console.log(data);
            $("#exampleModal1").modal();
            document.getElementById("title1").value = (data['title']); 
            document.getElementById("trainer1").value = (data['trainer']); 
        }
    });

    $('#deleteButton').on('click', function(){
        $.ajax({
            url:"delete.php",
            type:"POST",
            data: { id: event.id },
            success: function() {
                $('#exampleModal1').modal('hide');

                calendar.refetchEvents()
            }
        });
    });

    $('#annuleer').on('click', function(){
        calendar.unselect()
    });
},

【问题讨论】：

请确保您的每个活动都有唯一的ID。
每个事件在数据库中都有一个唯一的 id。多次调用 insert.php 文件。 delete.php 文件也会发生这种情况。这就是为什么会有多次插入和删除。

标签： jquery fullcalendar

【解决方案1】：

这是因为每次 eventClick 发生时，您都会在删除按钮上创建一个新的事件处理程序。那是没有必要的。

在脚本首次运行时定义一次处理程序。

在定义新的处理程序之前，要么清除所有以前的处理程序。

否则，只要您单击按钮，之前创建的所有处理程序都会同时运行，这就解释了为什么您之前单击的其他事件也会被删除。

【讨论】：

谢谢（再次）！我把它改成了 .off().on('click' 就行了。