桌面浏览器是否支持触摸事件？

Question

我正试图通过原型化一个非常简单的绘图应用程序来使用<canvas>和触摸像ontouchstart和的事件来加快HTML5的速度ontouchmove.

这在Android模拟器中显示并正常工作,我使用鼠标单击来模拟触摸事件.但是,在我的桌面浏览器(Safari 5.1.1,Windows 7上的Firefox 7)中运行时,它根本不起作用.

我认为鼠标点击事件将被解释为触摸事件,就像在模拟器中运行时一样.

我现在想知道桌面浏览器是否只是不支持触摸事件.

Answer 1

实际上反过来说.移动浏览器将触摸转换为鼠标事件以获得遗留支持 如果它需要在移动设备和桌面设备上工作,并且您并不真正需要触摸事件,则可以使用鼠标事件.如果做不到这一点,请绑定触摸和鼠标事件,并让触摸事件取消鼠标事件.这种方式在移动设备上触摸闪光和鼠标没有.在桌面上,触摸不会触发,鼠标也会触发.

对于pilau,这是取消移动设备上的点击事件的简单示例.请注意,问题更多的是绘图涉及点击拖动,这需要更多的代码进行检测,但基本思路是相同的,绑定您需要处理的事件.然后e.preventdefault()将阻止移动浏览器模拟点击类型事件.

$('#element').on('touchend click', function(e){

   // Do your onclick action now

   // cancel the onclick firing
   e.preventDefault();
});

Answer 2

Firefox 6及以上版本支持触摸事件。请参阅此处的兼容性表。

有关触摸事件的 MDN 文章

编辑：您是使用触摸屏还是鼠标进行测试？鼠标事件不会自动转换为触摸事件。有关如何使用鼠标模拟触摸事件的信息，请参阅这篇文章。