17

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

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

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

提前致谢。

4

7 回答 7

15

您是否尝试过包含Jquery UI Touch Punch？

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

希望能帮助到你！

于 2012-05-31T12:09:09.370 回答
9

这行得通

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

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

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

eventRender: function(event, element) {
            $(element).addTouch();
        }
于 2014-09-24T13:54:15.487 回答
2

由于我很难让它与 jQuery UI touch punch 一起使用，而且我找不到任何完整的示例代码，我想我会发布我用来在移动设备上创建和拖动事件的代码：

注意：此示例使用jQuery UI 触摸打孔。

$(document).ready(function() {

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

  $('.fc-view tbody').draggable();
});
于 2014-11-19T19:07:57.637 回答
2

根据此 FullCalendar 博客文章，在 v2.7.0 的 beta 版本中提供了 FullCalendar 触摸支持。

于 2016-03-28T23:26:14.693 回答
2

使用最新的Full Calendar 2.7.1 ，支持触控。您甚至可以设置新闻延迟选项。看看文档

于 2016-05-02T11:24:34.500 回答
1

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

这段代码对我有用：

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

$('#calendar').addTouch();
于 2016-04-18T04:51:53.790 回答
1

对于那些在移动设备上选择一天有困难的人，这个问题非常有帮助，使用 prop longPressDelay as 10 它可以工作！

在FullCalendar / Docs Touch 支持中查看更多信息

于 2019-10-09T16:42:28.243 回答