拖拽放弃IPad Web App - 同时保留Scroll功能

问题描述:

我正在使用Jquery UI拖放( http://jqueryui.com/demos/draggable )与 https://github.com/furf/jquery-ui-touch-punch
将触摸事件映射到鼠标事件。到目前为止,整个拖放工作正常。

I am using Jquery UI Drag and Drop ( http://jqueryui.com/demos/draggable ) together with https://github.com/furf/jquery-ui-touch-punch to map touch events over to mouse events. The whole drag and drop thing works fine so far.

我现在遇到的问题是我有一长串可拖动元素,我需要能够滚动浏览IPad上的列表......当我使列表元素可拖动时,这将不再起作用。

The problem I have now is that I have a long list of draggable elements and I need to be able to scroll through the list on IPad as well... When I made the list elements draggable this won't work anymore.

我尝试使用jqueryui提供的约束,如距离延迟
- 但即便如此,滚动事件似乎完全禁用/覆盖拖动事件。

I tried using the jqueryui provided constraints like distance and delay - but even then the scroll event seems to be totally disabled / overlayed with the drag event.

我可能需要编写一个自定义函数,例如只有向左移动至少50 px使其可拖动或其他东西。

I probably need to write a custom function like "only if move to left at least 50 px make it draggable" or something.

有没有人遇到类似的问题并且愿意分享这个问题?
Sencha或JQmobile等任何其他移动网络框架都配备了这样的功能吗?

Has anybody ever encountered a similar problem and is willing to share som thoughts about it? Are any other mobile web frameworks like Sencha or JQmobile equipped with such functionality?

提前致谢...

我通过切换 https://github.com/furf/jquery-ui-touch-punch
此解决方案中的代码: Javascript拖放触摸设备

最后我需要调整是删除 event.preventDefault(); 重新启用搜索。

In the end all I needed to adjust was to remove the event.preventDefault(); to re-enable scolling.

编辑

基本上我使用了我链接的第二个答案中的代码 - 进行了一些调整。
这是我的解决方案的JS小提琴,希望它有所帮助: http://jsfiddle.net/ LQuyr / 8 /

Basically I used the code from the second answer I linked - with some adjustments. Here is the JS fiddle of my solution, hope it helps: http://jsfiddle.net/LQuyr/8/