Question

我一直在寻找平板电脑友好的活动日历，但我找不到合适的活动日历。但是FullCalendar是一个最好的jQuery日历插件，在桌面和平板电脑上看起来很棒。

此日历在桌面上完美运行，但在平板电脑方面，我无法根据触摸和滑动选择活动的开始时间和结束时间。当我这样做时，日历会滚动。这有什么解决方案吗？我一直在四处寻找解决方案。

有没有人遇到过这个问题并且你解决了吗？请分享您如何解决它的方法。任何形式的帮助都表示赞赏。

提前致谢。

Answer 1

您是否尝试过添加Jquery UI Touch Punch？

默认情况下，Jquery UI不支持触摸事件，因为它未针对移动设备进行优化。 Touch Punch通过Jquery UI Drag＆amp; Drop功能解决了我的问题，这些功能似乎也被FullCalendar使用。

希望它有所帮助！

Answer 2

这项工作

我使用了这个插件：jquery.ui.touch.js

为iOS和Android设备的Fullcalendar添加Touch支持

只需使用它来初始化您的日历：

eventRender: function(event, element) {
            $(element).addTouch();
        }

Answer 3

由于我努力使用jQuery UI触控功能，并且我无法找到任何完整的示例代码，我想我发布了用于创建和拖动事件的代码。移动设备：

注意：此示例使用jQuery UI touch punch。

$(document).ready(function() {

  $('#calendar').fullCalendar({
    ...
    eventAfterRender: function(event, element, view) {
      element.draggable();
    }
  });

  $('.fc-view tbody').draggable();
});

Answer 4

根据this FullCalendar blog post的v2.7.0测试版提供了FullCalendar触控支持。

Answer 5

使用最新的 Full Calendar 2.7.1，触摸为Supported。您甚至可以设置按延迟选项。只需查看文档

即可

Answer 6

我使用了这个插件：jquery.ui.touch.js

这段代码对我有用：

$('#calendar').fullCalendar({
[...]
});

$('#calendar').addTouch();

Answer 7

对于那些在移动设备this question上选择一天的人来说非常有帮助，将prop longPressDelay设置为10可以正常工作！

在FullCalendar / Docs Touch Support

中查看更多

如何使FullCalendar在触摸设备上工作？

7 个答案: