Question

我正在使用完整日历，因为我需要在eventclick上同时处理单击和 dblclick 事件。为此，我做了以下代码。

从服务器和json数据中获取数据：

   function FormJosn(Data) {
            var Json = [];
            for (var i = 0; i < Data.length; i++) {
                Json.push({
                    "id": Data[i].Appointment_ID,
                    "title": Data[i].F_Name + ' ' + Data[i].L_Name,
                    'start': Data[i].start,
                    'end': Data[i].End,
                    'allDay': false
                });
            }
            Calander(Json);
        }

并渲染完整的日历，

function Calander(Data) {
        var calendar = $('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            selectable: true,
            selectHelper: true,
            editable: true,
            droppable: true,
            drop: function (date, allDay) { // this function is called when something is dropped

                // retrieve the dropped element's stored Event Object
                var originalEventObject = $(this).data('eventObject');

                // we need to copy it, so that multiple events don't have a reference to the same object
                var copiedEventObject = $.extend({}, originalEventObject);

                // assign it the date that was reported
                copiedEventObject.start = date;
                copiedEventObject.allDay = allDay;

                // render the event on the calendar
                // the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
                $('#calendar').fullCalendar('renderEvent', copiedEventObject, true);

                // is the "remove after drop" checkbox checked?
                if ($('#drop-remove').is(':checked')) {
                    // if so, remove the element from the "Draggable Events" list
                    $(this).remove();
                }

            },
            select: function (start, end, allDay) {

                SetAppointmentBookingDateTime(start);
                calendar.fullCalendar('unselect');
            },
            editable: false,
            disableResizing:false,
            events: Data,

            eventRender: function (event, element)
            {
                element.bind('click', function (event, element) {

                    var doubleClickOpportunity = 200, // Adjust this to whatever feels right
                        $elem = $(event.target),
                        clicker = $elem.data('clicker'); // Holder for the doubleclick setTimeout

                    if (clicker) {
                        // If there's a setTimeout stored in clicker, then this is a double click
                        clearTimeout(clicker);
                        $elem.data('clicker', '');
                        $elem.trigger('doubleclick');
                    } else {
                        $elem.data('clicker', setTimeout(function () {
                            $elem.data('clicker', '');
                            $elem.trigger('singleclick');
                        }, doubleClickOpportunity));
                    }

                });

                element.bind('singleclick', function (event, element) {
                    // I'm a single click!
                    window.location = "http://" + window.location.host + "/Hospital/Treatment/AddTreatment/" + event.id;
                });

                element.bind('doubleclick', function () {
                    // I'm a double click!
                    $(".Modify-Appointment").modal("show");
                });

            }
        });
    }

我绑定了click和dblclick eventRender，它可以正常工作，但我没有获得该事件的数据，因为它在eventClick函数上得到它。

我需要这些数据继续进行。

Answer 1

为了将数据传递给jQuery的回调，根据bind documentation，您应该使用以下签名：

.bind( eventType [, eventData ], handler )

所以你必须将一个对象传递给回调，如下所示：

element.bind('singleclick', { event: event, element: element }, function () {
    // I'm a single click!
    window.location = "http://" + window.location.host + "/Hospital/Treatment/AddTreatment/" + event.id;
});

另请注意，从jQuery 1.7开始，.on()是.bind()

之上的首选方法

在fullcalendar中手动绑定事件获取事件数据

1 个答案: