Question

我需要在dblclick上工作的实现函数，就像dayClick回调一样。我尝试了所有解决方案，但我找不到任何解决方案，例如Michel's answer。顺便说一下，所有线程都很老了。

这个问题看起来很微不足道，但我没有想到它为什么不起作用。

有谁知道在最新版本中应如何做到这一点？

更新

好的，我发现了问题:) 当我设置此选项时，它会停止工作：selectable: true

我添加了这个：

dayRender: (date, element, view) ->
    element.bind "dblclick", ->
        alert "double click!"

dayClick: (date, jsEvent, view) ->
    $(".fc-highlight").removeClass("fc-highlight")
    $(jsEvent.toElement).addClass("fc-highlight")

完美无缺：）

感谢您的帮助。

更新2

然而，上述解决方案并不完美。有些元素涵盖了日期对象，并且它在一天的整个表面上都不起作用，所以我提出了另一个解决方案：

findClickedDay = (e) ->
    days = $("#calendar .fc-day")
    i = 0
    while i < days.length
        day = $(days[i])
        mouseX = e.pageX
        mouseY = e.pageY
        offset = day.offset()
        width = day.width()
        height = day.height()
        if mouseX > offset.left and mouseX < offset.left + width and mouseY > offset.top and mouseY < offset.top + height
          return day
        i++

eventAfterAllRender: (view) =>
    $("#calendar").bind "dblclick", (e) =>
        clickedDay = findClickedDay(e);
        if clickedDay.length == 0 then return
        date = new Date(clickedDay.data('date'))
        alert "dblclick on date: #{date}"

Answer 1

fullcalendar V1.x

它适用于eventRender Click for jsfiddle link.

eventRender在呈现事件时触发。＆安培;＆安培; dayRender是用于修改日期单元格的钩子。 Click for dayRender docs

eventRender: function(event, element) {
    element.bind('dblclick', function() {
       alert('double click!');
    });
},

Answer 2

我认为这是一个常见的问题，通常需要一些黑客攻击。 @Valar Morghulas的事件渲染解决方案非常适合捕捉事件doubleclicks。对于日历的其余部分，也许这有点清洁。

（你基本上记得使用dateClick回调一次单击的日期，并在鼠标移动后忘记它）

jsfiddle demo

$('#calendar').fullCalendar({
    ...
    dayClick: dayClickCallback,
    eventRender: eventRenderCallback,
    ...
});

var slotDate;

function dayClickCallback(date){
    slotDate = date;
    $("#calendar").on("mousemove", forgetSlot);
}

function eventRenderCallback(event,element){
    element.on("dblclick",function(){
        dblClickFunction(event.start)          
    });   
}

function forgetSlot(){
    slotDate = null;
    $("#calendar").off("mousemove", forgetSlot);
}

function dblClickFunction(date){
    alert(date);
}

$("#calendar").dblclick(function() {
    if(slotDate){
        dblClickFunction(slotDate);
    }
});

Answer 3

                dayClick: function(date, jsEvent, view) {
                prevTime = typeof currentTime === 'undefined' || currentTime === null
                    ? new Date().getTime() - 1000000
                    : currentTime;
                currentTime = new Date().getTime();

                if (currentTime - prevTime < 500)
                {
                    //double click call back
                    console.log("this is double click");
                }
            },

您可以点击双击时间

Answer 4

我遇到了与@Szymon Rut相同的问题，双击不在整个单元格中工作，在单元格的左上角没有响应。对我有用的只是使用on（）而不是bind（）......

dayFunction = function(date, cell) {
    cell.on('dblclick', {date: date}, function(e) {
        var view = 'month';
        self.openAddEvent(e, view,  e.data.date)
    });
}

Answer 5

将currentTime设为静态变量，然后将张庭升的代码包装到函数中，然后可以在任何“点击”处理程序中使用它：

FullCalendarActions = {
    currentTime: null, 
    isDblClick : function() {
        var prevTime = typeof FullCalendarActions.currentTime === null
        ? new Date().getTime() - 1000000
        : FullCalendarActions.currentTime;
        FullCalendarActions.currentTime= new Date().getTime();
        return FullCalendarActions.currentTime - prevTime < 500;
    }
}

...在FullCalendar处理程序中使用：

dayClick : function(date, jsEvent, view) {
    if (FullCalendarActions.isDblClick()){
        // whatever...
    }
}

Answer 6

有点骇人听闻，但您可以很容易地在dayClick回调挂钩中“模拟”双击。优点是您可以在date moment（）变量中使用单击日期和时间。

var doubleClick = false;
$('#calendar').fullCalendar({
    dayClick: function(date, jsEvent, view) {
        if(!doubleClick) {
            doubleClick = true;
            setTimeout(function() { doubleClick = false; }, 500); //this waits for a second click for the next 500ms
        }
        else {
            //do your double click action here (date and time available in date variable)
        }
    }
});

Fullcalendar日双击回调

6 个答案: