javascript - 处理全日历中的单击和双击事件

Question

我正在使用 fullcalendar，单击日历的特定日期时，它应该触发单击事件，双击它应该触发双击事件。但是在页面加载时，当我第一次单击时，它没有响应并且单/双单击无法正常工作。

/* config object */
            $scope.uiConfig = {
              calendar:{
                height: 450,
                editable: false,
                    defaultView: 'month',
                    columnFormat: {
                        month: 'ddd',
                        week: 'ddd dd/MM',
                        day: 'dddd M/d'
                    },
                buttonText: {
                        month: "Mois",
                        week: "Semaine",
                        day: "Jour",
                        today:"aujourd'hui",
                },
                eventClick: $scope.alertEventOnClick,
              }
            };


$scope.alertEventOnClick = function(calEvent, jsEvent, view) {


                $("#onClick").click(function (e) {
                    var $this = $(this);
                    if ($this.hasClass('clicked')){
                        $this.removeClass('clicked'); 

                         //perform double-click action  
                    }else{
                         $this.addClass('clicked');
                         setTimeout(function() { 
                             if ($this.hasClass('clicked')){
                                 $this.removeClass('clicked'); 

                                  //perform single-click action    
                             }
                         },10);          
                    }
                });

        };

Answer 1

使用完整日历 eventRender回调以附加您自己的事件。

例如:

$('#calendar').fullCalendar({
    //events: [
        //....
    //],
    eventRender: function(event, element) {
         $(element).on({
             click: function() {
                 // Handle click...
             },
             dblclick: function() {
                 // Handle double click...
             }
         });
    }
});