模拟touchstart和touchend事件?

我正在开发一个主要用于ipad的jquery组件。 所以无论如何都要在桌面上模拟’touchstart和’touchend’事件,而不是让设备本身来检查事件。

您可以在jQuery中创建自己的自定义事件:

var event = $.Event( "touchstart", { pageX:200, pageY:200 } ); 

您可以针对DOM中的任何元素发出它们:

 $("body").trigger( event ); 

演示: http : //jsbin.com/ezoxed/edit#javascript,html
进一步阅读: http : //api.jquery.com/category/events/event-object/

请记住,现在市场上有各种其他类型的接口,不支持touchstarttouchend事件。 例如,Windows 8已经占据了移动市场中的平板电脑,它使用了由指针组成的更抽象的事件模型。

Chrome浏览器中的Chrome开发工具可让您模拟触摸事件。 请参阅https://developers.google.com/chrome-developer-tools/docs/mobile-emulation 。

来自文档……

模拟触摸事件

Touch是一种难以在桌面上测试的输入法,因为大多数桌面都没有触摸输入。 必须在移动设备上进行测试可以延长开发周期,因为您所做的每项更改都需要推送到服务器然后加载到设备上。

此问题的解决方案是在开发计算机上模拟触摸事件。 对于单点触控,Chrome DevTools支持单点触摸事件仿真,以便更轻松地在桌面上调试移动应用程序。

要在Chrome浏览器中使用(从版本29.0.1547.65开始):

  1. 选择浏览器窗口右上角的Chrome菜单(三个堆叠的行)。
  2. 选择工具>开发人员工具。 (快捷键Shift + Control + I)
    工具窗口将显示在底部,并选中选项卡控制台。
  3. 在右下角单击设置cog(看起来像齿轮)。
    将出现一个设置面板,顶部显示“常规”。
  4. 单击左侧的“覆盖”以选择覆盖面板。
  5. 向下滚动并选中“启用触摸事件”
  6. 重新加载您的页面

您的鼠标现在将显示为模糊圆圈。 点击“触摸”。

自2018年起,Chrome DevTools完全支持设备模拟,无需覆盖设置。 只需切换设备工具栏(Ctrl + Shift + M)即可使浏览器进入移动模式,然后鼠标即可触发触摸事件。