jQuery FullCalendar在触摸设备上工作 - 但事件的小问题 [英] jQuery FullCalendar working on touch devices - but minor issue with events

查看:107
本文介绍了jQuery FullCalendar在触摸设备上工作 - 但事件的小问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

http://page-test.co.uk/cal/ - FullCalendar演示



我已经设置好了这是一个基本的jQuery FullCalendar安装程序,其中包含相关的额外功能以支持触控设备。



链接页面中包含的文件都是默认文件。



该演示完美适用于非触控设备,但触控设备很难应付。 b
$ b

一旦拖动一个项目,另一个项目不能完成,主要在iPhone / iPad上进行测试(其他触摸设备的功能差不多完全相同)。所以你可以拖动任何项目,但其他人都被锁定。



一些关键点:$ b​​
$ b


  • 更改视图(月/周等),然后允许再次拖动所有内容。

  • 元素第一,然后可以拖动,但不是其他人,直到你先触摸它们。 在BlackBerry Playbook上,它实际上行为略有不同。如果你去拖动一个不同的元素(通常什么都不会发生),那么在PlayBook上,它看起来什么都不做(就像你在屏幕上滑动手指一样) - 但是当你放手(还没有发生任何事情)去选择可拖动的元素,然后取消选择它。然后拖动该元素即可正常工作。 改变设备的方向可立即锁定页面上的所有元素,并将视图更改为月/ week或触摸元素一次必须先执行,然后才能再次拖动任何内容。 在线修复,但我花了几个小时,却无法让它做任何事情。



    我只想让它在iPad / iPhone上工作。



    它似乎或者是mouseup / touchend没有触发某些东西,或者第一次拖动之后touchstart事件会被删除,但我无法解决问题。编辑:


    $ b

    解决方案

    /touchpunch.furf.com/ \">触摸打卡和dayRender以允许在触摸设备上选择一天或多天。我只是添加了源代码,并将Touch Punch中的addTouch()函数添加到日单元格的渲染中:

      dayRender:function (日期,单元格){

    cell.addTouch();

    },

    这至少可以让你选择一天或几天一个触摸设备,您可能能够使用其他Touch Punch功能做更多,但我没有尝试过。






    我正遇到与iPad相同的问题。我试过 https://github.com/jboesch/jQuery-fullCalendar-iPad-drag-drop以及我的fullcalendar应用程序,并且可以拖动一个事件但不能拖动另一个事件,它会滚动。我禁用滚动,但仍然得到相同的行为。我也尝试了这里提到的最后一个选项 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上的谷歌日历,它也缺少这项功能,如果它没有在浏览器上运行(iPad上的Safari),他们会通知您使用移动版本。移动版本在月视图中不显示任何事件,因此这不适用于我的应用程序。具有可选择性和拖放功能的全功能fullcalendar将是理想选择,但触摸设备可能不支持此功能。我也会继续寻找解决方案,但是如果谷歌不提供这些功能,实施起来可能并不容易,我们可能需要提供移动版本和/或无选择性的生活,并在触摸屏上拖放。我非常感谢其他人的帮助。


    http://page-test.co.uk/cal/ - FullCalendar demo

    I have set this up which is a basic jQuery FullCalendar setup with the relevant extras to allow support on touch devices.

    The included files in the linked page are all default ones.

    The demo works perfectly on non-touch devices, but touch devices struggle.

    Testing on an iPhone/iPad mainly (other touch devices do more or less exactly the same) once one item is dragged, another one can't be. So you can drag any item, but then the others are sort of locked.

    Some key points:

    • Changing view (month/week etc.) then allows everything to be dragged again

    • If you tap/touch another element first, that then can be dragged, but not others until you touch those first.

    • On a BlackBerry Playbook it actually acts slightly differently. If you go to drag a different element (normally nothing at all would happen) then on the PlayBook it appears to do nothing (as you swipe your finger across the screen) - but when you let go (nothing still has happened yet) on letting go it selects the draggable element and then unselects it. If you then go to drag that element it works fine.

    • Changing the orientation of the device instantly locks all elements on the page and either changing the view to month/week or touching an element once must be performed before anything can be dragged again.

    I bet this is a one line fix, but I've spent hours and just can't get it to do anything.

    I just want it working on iPad/iPhone.

    It seems to be either that the mouseup/touchend isn't triggering something, or that the touchstart event gets removed after the first drag, but I just can't fins the problem.

    解决方案

    Edit:

    I used Touch Punch and dayRender to allow selecting a day or multiple days on a touch device. I just added the source and added the addTouch() function from Touch Punch to the rendering of the day cell:

    dayRender: function( date, cell) {
    
    cell.addTouch();
    
    },
    

    This at least lets you select a day or days on a touch device, you may be able to use the other Touch Punch functions elsewhere to do more but I haven't tried it.


    I am experiencing the same issue with an iPad. I tried https://github.com/jboesch/jQuery-fullCalendar-iPad-drag-drop as well with my fullcalendar application and can drag the one event but can't drag another, it scrolls. I disabled scrolling, but still get the same behavior. I also tried the last option mentioned here https://code.google.com/p/fullcalendar/issues/detail?id=724&q=ipad&colspec=ID%20Type%20Status%20Milestone%20Summary%20Stars with this project https://github.com/joshgerdes/jquery.ui.touch

    I also want to make a selection of days or hours to create an event. I took a look at google's calendar on the iPad, it is also missing this functionality and they have a notification to use the mobile version if its not working on your browser (safari on the iPad). The mobile version does not display any events in the month view so this won't work as an option for my application. A fully functioning fullcalendar with selectability and drag drop would be ideal, but touch devices might not support this well. I'll keep looking for a solution as well, but if google doesn't offer the functionality, it might not be easy to implement and we might need to offer a mobile version and/or live without selectability and drag and drop on touch screens. I'd greatly appreciate anyone else's help as well.

    这篇关于jQuery FullCalendar在触摸设备上工作 - 但事件的小问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

    查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆