javascript - 全日历,点击按钮删除事件

标签 javascript jquery fullcalendar

我尝试在单击按钮“x”时删除事件,但不起作用,并且没有收到任何错误。

我在参数“eventRender”中分配函数点击。

这是我的 JavaScript 代码:

$('#calendar').fullCalendar({
        locale: 'es',
        weekends: false, //ocultar fines de semana
        defaultView: 'agendaWeek',
        allDaySlot: false,
        header: {
            left: 'month,agendaWeek,agendaDay,listDay',
            center: 'title',
            right: 'prev,next today'
        },
        height: 'auto',
        minTime: "10:00:00",
        maxTime: "20:00:00",
        editable: true,
        //droppable: true, // this allows things to be dropped onto the calendar
        dayClick: function(date, jsEvent, view) {
            console.log('Clicked on: ' + date.format());
            console.log('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY);
            console.log('Current view: ' + view.name);
            var hoy = moment();
            if(date.format("YYYY-MM-DD HH:mm") >= hoy.format("YYYY-MM-DD HH:mm")){
                asignarCita(date);
            }else{
                swal({
                    title: "Cita no disponible",
                    text: "La fecha u hora seleccionada ya ha pasado."
                });
            }
        },
        eventRender: function(event, element) {
            element.prepend( "<div class='ibox-tools'><a style='background-color: transparent; margin-right: 10px' class='pull-left'><i class='fa fa-times closeon'></i></a></div>" );
            //element.append( "<span class='closeon'>X</span>" );
            console.log(element.find('closeon'));
            element.find(".closeon").click(function() {
                $('#calendar').fullCalendar('removeEvents',event._id);
            });
        },
        events: [
            {
                title: 'All Day Event',
                start: '2014-10-01'
            },
            {
                title: 'Long Event',
                start: '2014-10-07',
                end: '2014-10-10'
            },
            {
                id: 999,
                title: 'Repeating Event',
                start: '2014-10-09T16:00:00'
            },
        ],
    });

问题出在哪里?

最佳答案

试试这个:

eventRender: function(event, element, view) {
        if (view.name == 'listDay') {
            element.find(".fc-list-item-time").append("<span class='closeon'>X</span>");
        } else {
            element.find(".fc-content").prepend("<span class='closeon'>X</span>");
        }
        element.find(".closeon").on('click', function() {
            $('#calendar').fullCalendar('removeEvents',event._id);
            console.log('delete');
            });
    },

https://jsfiddle.net/vc9ytv2k/

关于javascript - 全日历,点击按钮删除事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40974441/

相关文章:

jquery 全日历 : is init done?

javascript - 获取与所有此类元素相比单击的元素的索引

javascript - 使用 Laravel 在 FullCalendar 中重复发生的事件

jquery - jQuery 选项卡中的 FullCalendar 最初不会通过 ajax 加载

javascript - 使用 Stack Navigator 时 Prop 未定义

jquery - jqGrid动态列绑定(bind)

jquery - 找出 id 以 lkid 结尾的最近的隐藏输入字段

javascript - 在 JavaScript 中启动另一个函数之前等待一个函数结束

javascript - jQuery 是否支持从 ajax 调用检索到的数据的 html 转义?

java - 如何在按下空格键时使用 Jquery 自动完成功能获取数据?