http://page-test.co.uk/cal/- 完整日历演示
我已经设置了这个,这是一个基本的jQuery FullCalendar设置,具有相关的附加功能,以允许在触摸设备上提供支持。
链接页面中包含的文件都是默认文件。
该演示在非触摸设备上完美运行,但触摸设备很难。
主要在iPhone/iPad上进行测试(其他触摸设备或多或少完全相同(,一旦拖动一个项目,另一个项目就不能了。所以你可以拖动任何项目,但其他项目有点被锁定。
一些关键点:
-
更改视图(月/周等(然后允许再次拖动所有内容
-
如果您先点击/触摸另一个元素,则可以拖动该元素,但不能拖动其他元素,直到您先触摸这些元素。
-
在黑莓剧本上,它实际上的行为略有不同。如果你去拖动一个不同的元素(通常什么都不会发生(,那么在PlayBook上它似乎什么都不做(当你在屏幕上滑动手指时( - 但是当你放手时(什么都没有发生(在放手时它会选择可拖动的元素,然后取消选择它。如果您随后拖动该元素,它可以正常工作。
-
更改设备的方向会立即锁定页面上的所有元素,并且必须执行将视图更改为月/周或触摸元素一次,然后才能再次拖动任何内容。
我敢打赌这是一个单行修复,但我花了几个小时,只是无法让它做任何事情。
我只想让它在iPad/iPhone上运行。
似乎要么是鼠标向上/触摸端没有触发某些东西,要么是第一次拖动后触摸启动事件被删除,但我只是无法解决问题。
编辑:
我使用Touch Punch和dayRender允许在触摸设备上选择一天或多天。我刚刚添加了源代码,并将 Touch Punch 中的 addTouch(( 函数添加到日单元格的渲染中:
dayRender: function( date, cell) {
cell.addTouch();
},
这至少可以让您在触摸设备上选择一天或几天,您可以在其他地方使用其他 Touch Punch 功能来做更多的事情,但我还没有尝试过。
我在使用iPad时遇到了同样的问题。我也尝试了 https://github.com/jboesch/jQuery-fullCalendar-iPad-drag-drop 我的全日历应用程序,可以拖动一个事件但不能拖动另一个事件,它会滚动。我禁用了滚动,但仍然得到相同的行为。我还尝试了 https://code.google.com/p/fullcalendar/issues/detail?id=724&q=ipad&colspec=ID%20Type%20Status%20Milestone%20Summary%20Stars 这个项目中提到的最后一个选项 https://github.com/joshgerdes/jquery.ui.touch
我还想选择天数或小时来创建事件。我在iPad上查看了Google的日历,它也缺少此功能,并且如果移动版本无法在您的浏览器上运行(iPad上的safari(,他们会通知使用移动版本。移动版本不会在月视图中显示任何事件,因此这不能作为我的应用程序的选项。具有可选性和拖放功能的全功能完整日历将是理想的,但触摸设备可能无法很好地支持此功能。我也会继续寻找解决方案,但如果谷歌不提供该功能,它可能不容易实现,我们可能需要提供移动版本和/或没有选择性和拖放到触摸屏上的实时版本。我也非常感谢其他人的帮助。
使用触摸打孔拖动事件,在 eventRender 中添加代码:
$.support.touch = 'ontouchend' in document;
if ($.support.touch) {
$(element).draggable();
}
要向DayCells添加触摸功能,请使用另一个触摸JS文件:https://github.com/joshgerdes/jquery.ui.touch并在 dayRender 中添加 cell.addTouch((
几天后,我的日历中也会有(基于完整日历(
http://codecanyon.net/user/wolberspl/portfolio?ref=wolberspl