问题:我们是否应该在运行时检查触摸设备(使用Modernizr.touch?),然后在触摸设备时使用角度滑动服务,并在不使用鼠标时使用鼠标事件。 ;吨?
目标:我正在编写Slider Directive,我想移动滑块按钮。 我想在桌面上处理 mousedown , mousemove 和 mouseup 事件,我希望在触摸屏上有类似的行为。我在桌面上使用了鼠标事件,但我已经修改了代码以使用有角度的 $ swipe 服务。现在触摸屏功能运行良好,但如果桌面浏览器上的 mouseup 事件发生在目标元素之外,则会丢失。
这是一个演示$ swipe实用程序的jsBin: http://jsbin.com/berome/1/edit?html,js,console,output
在触摸屏设备上,演示功能正常。在目标元素上拖动手指时,启动事件,移动事件和结束事件分别触发。
在桌面上,开始和移动事件会触发,但结束事件只会在 mousedown < em>在目标div内释放。这是预期的行为,因为 mouseup 绑定到目标元素。但是,如果在 mousemove 事件期间将光标移到div之外,然后释放鼠标按钮,则不会发生 end 事件。此外,当光标在目标内返回时, mousemove 事件将继续触发! (在演示中尝试。它会卡在 mousemove 状态,直到目标中的另一个 mousedown - mouseup 序列)
对于桌面实现, mousedown 将绑定到目标元素,而 mousemove 和 mouseup 将绑定到 mousedown 事件中的$ window (或某些父元素)。即使鼠标向下释放, mouseup 也会始终触发 - 即使光标位于目标元素之外! mousemove 和 mouseup 将在 mouseup 事件中解除绑定。
使用$ swipe似乎没有太多文档或示例。 ngBook有一两段但没有工作实例。有什么建议或意见吗?我倾向于两种实现:一种用于触摸,一种用于桌面。
谢谢!
答案 0 :(得分:1)
你是对的,ngTouch&#39; s swipe的文档很少。刚开始深入研究这个问题,我很难找到任何东西。谢谢你的榜样。 从我有限的理解中我可以看到的问题的唯一解决方案是,您将其视为触摸设备上的滚动并取消。这些句子来自documentation:
如果垂直距离更大,这是一个滚动,我们让 浏览器接管。发送取消事件。
取消可以在浏览器的touchcancel上调用,也可以在我们调用时调用 如上所述开始滚动。
我还没有尝试过这个,但是我想到了这个想法,我觉得它对你我来说可能有用(因为我确定我很快就要处理它)。