【发布时间】：2012-02-27 15:27:55
【问题描述】：
我正在使用 jsTree 在多个树视图之间拖放项目。这适用于个人电脑，但不适用于平板电脑（Apple 和 Android）。我知道 JQueryUI 没有对平板电脑的内置 DnD 支持，我已经尝试了一些可用的调整，但都没有奏效。
是否可以在平板电脑上使用 jsTree 中的拖放操作？
谢谢！
【问题讨论】：
标签： javascript jquery drag-and-drop jstree
【发布时间】：2012-02-27 15:27:55
【问题描述】：
我已经研究这个问题好几天了，专注于让现有的使用 jsTree 的 Web 应用程序在 iPad 上工作。使用 jquery.ui.touch.js 我可以得到大部分的方式。触摸事件可以映射到 jstree 所期望的鼠标事件，树将允许我拖动，但放置目标永远不会被识别，实际上 drop_check 函数永远不会被调用。所以它并不完全在那里。
我认为这可能是因为只有一些触摸事件可以映射到鼠标事件，例如 jquery.ui.touch.js：touchstart=mousedown、touchmove=mousemove、touchend=mouseup。但是，jstree 还依赖于 mouseenter 和 mouseleave 来检查放置目标，而我没有针对这些的事件。 touchenter 和 touchleave 已经讨论过了，但我认为 iPad 上的 Safari 浏览器此时不会触发它们。我一直在考虑尝试通过查看坐标并检查重叠来从 touchmove 事件中生成 mouseenter 和 mouseleave 事件，但我还没有尝试过。
更新：2012 年 5 月 18 日。我认为它现在正在工作。有几件事与我想象的不同。最大的突破是当我意识到触摸事件目标元素永远不会从 touchstart，通过所有 touchmoves 到 touchend 发生变化。然而，mousemove 事件期望获得该事件的元素是您正在移动的元素。因此，我更改了插件以将 mousemove 事件分派到 touchmove 事件中坐标处的元素，它就像一个冠军一样工作。事实证明，一旦我这样做了，我就不再需要手动触发 mouseenter 和 mouseleave 事件，因为 jQuery 会处理这些事件。
右键单击上下文菜单（按住不放）在我的简单测试应用程序中有效，但在我们的 Web 应用程序中无效，直到我在上下文菜单事件后的右键上添加了一个模拟的 mouseup 事件。
我修改过的 jquery.ui.touch.js 已经上传到这里： http://code.google.com/p/jquery-ui-for-ipad-and-iphone/issues/detail?id=18
【讨论】：
-
感谢您的发帖，很高兴知道我不是唯一一个调查此问题的人。 :) 我已经尝试了一些库，包括 jquery.ui.touch.js，但到目前为止它们都没有工作。我还注意到，一般来说，Android 的默认浏览器不能很好地处理触摸事件。 FireFox 做得更好……
-
我这里已经有了一些进展，现在真的可以拖拽了！首先，我使用
document.elementFromPoint来发现触摸结束的 DOM 元素，这样我们就可以在触摸在屏幕上移动时对其进行跟踪。然后，每当该元素更改时，除了 mousemove 之外，我还手动触发 mouseleave 和 mouseenter 事件。最大的突破是当我意识到 changedTouches 元素永远不会改变，只要你按住鼠标，所以 jquery.ui.touch 将模拟鼠标事件分派给原始元素，而不是当时触摸移动的东西. -
仍在努力让右键工作，然后很高兴分享。
-
你是冠军！ :D 非常感谢分享代码，它就像一个魅力。这将使我的应用程序更加有用。
-
嗨，Kathy，你能提供更多关于如何使用你的文件的信息吗？我已经尝试将它包含在页面上，但没有成功。是否需要以任何方式初始化？