Question

我正在使用FullCallendar和Jquery。我制作了一个谷歌日历，如界面和从json文件拉事件。当用户点击一天时，div会打开以便他们输入信息，点击添加事件并添加事件。在用户单击添加事件时第二次单击时，将添加两个事件，一个在第一个单击日，另一个在所选日。在第三次单击时添加3个事件，依此类推。这是代码： var c = 0;

function cleanEventBubble(){
    $('#event').hide();
    $('td').removeClass('selDay');
    $('#eventDate').text('');
    $('#calEvent,input:text').val('');
}

function createEvent(date, allDay, jsEvent, View, selCell){
    //Clean the event bubble and calendar
    cleanEventBubble();
    $(selCell).addClass('selDay');
    $('#eventDate').append(date.toDateString());
    $('#event').css('left', jsEvent.pageX);
    $('#event').css('top', jsEvent.pageY);
    $('#event').show();

    $('#btnAddEvent').click(function(){addEvent(date, $('#title').val(), c)});
}

function addEvent(date, title, id){
    $.ajax({
            type:'get',
    <cfoutput>url:  '#strURL#'</cfoutput>,
            data:{
                method:'addEvent',
                user:1,
                title:title,
                allDay:'true',
                start:$.fullCalendar.formatDate( date, 'yyyy-MM-dd' )
                },
            dataType:   'json',
            success: function(data, status){alert('response: ' + data);},
            error: function(data){$('#returnMess').html(data);}

    });
    $('#calendar').fullCalendar( 'refetchEvents' )
    cleanEventBubble();
}

/**/
function removeEvent(id){
    $('#calendar').fullCalendar('removeEvents', id);
}

function updateEvent(id, title){
    var event = $('#calendar').fullCalendar('clientEvents', id);
    event.title = title;
    $('#calendar').fullCalendar('updateEvent', event);
}


$(document).ready(function() {
    //Create JQuery connection to obj
    $('#event').hide();
    //Make event bubble draggable
    $('#event').draggable();

    $('#evBubbleClose').click(cleanEventBubble);
    // page is now ready, initialize the calendar...
    $('#calendar').fullCalendar({
        // put your options and callbacks here date, allDay, jsEvent, view
        dayClick:function(date, allDay, jsEvent, view){
           createEvent(date, allDay, jsEvent, view, this);
        },
        <cfoutput>events: '#strURL#'+'?wsdl&method=getEvents'</cfoutput> ,
        theme: true,
        header: {left: 'prev,next today', center: 'title', right: 'month,agendaWeek,agendaDay' }, 
        editable:true
    });

    //$('#calendar').fullCalendar('renderEvents');

});

Answer 1

好的，这是没有布尔标志的解决方案：）

而不是$(this).remove();

使用

$('#calendar').fullCalendar( 'removeEvents', event.id );

See documentation

Answer 2

是否因为您有两个创建事件的点击事件？（我不确定你'按钮'在哪里）

第一个'添加事件'在dayClick上调用：

  dayClick:function(date, allDay, jsEvent, view){
           createEvent(date, allDay, jsEvent, view, this);
        },

单击addEvent按钮时创建的第二个事件是什么？

$('#btnAddEvent').click(function(){addEvent(date, $('#title').val(), c)});

尝试仅使用dayClick添加事件，看看它是否按预期工作，然后从那里开始。

向FullCalendar添加事件时，它们是重复的 - 多次调用以无故添加事件

2 个答案: