我正在使用 Jquery UI 拖放 (http://jqueryui.com/demos/draggable) 和 https://github.com/furf/jquery-ui-touch-punch 将触摸事件映射到鼠标事件。到目前为止，整个拖放操作都很好。
我现在遇到的问题是，我有一长串可拖动元素，我还需要能够在 iPad 上滚动列表...当我将列表元素设置为可拖动时，这将不再起作用。
我尝试使用 jqueryui 提供的约束，例如 distance 和 delay
- 但即便如此，滚动事件似乎完全被拖动事件禁用/覆盖。
我可能需要编写一个自定义函数，例如“仅当向左移动至少 50 像素使其可拖动”或其他内容。
有没有人遇到过类似的问题并愿意分享一些想法？ Sencha 或 JQmobile 等其他移动 Web 框架是否配备了此类功能？
提前谢谢...
【问题讨论】：
标签： javascript jquery ipad jquery-ui web-applications
这当然取决于您的设计，但您可以尝试使用手柄。
这是 jQuery UI 的文档示例：
<div id="draggable" class="ui-widget-content">
<p class="ui-widget-header">drag with handle</p>
</div>
<div id="draggable2" class="ui-widget-content">
<p>drag from content</p>
<p class="ui-widget-header">not drag with handle</p>
</div>
$("#draggable").draggable({handle:"p"});
$("#draggable2").draggable({cancel:"p.ui-widget-header"});
或者至少取消选项可以给你一个开始。
【讨论】：
我通过切换 https://github.com/furf/jquery-ui-touch-punch 解决了这个问题 此解决方案中的代码：Javascript Drag and drop for touch devices。
最后我需要调整的是删除event.preventDefault();以重新启用scolling。
编辑
基本上，我使用了我链接的第二个答案中的代码 - 进行了一些调整。 这是我的解决方案的 JS 小提琴，希望对您有所帮助：http://jsfiddle.net/LQuyr/8/
【讨论】：