模拟touchstart和touchend事件？

Question

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

Answer 1

您可以在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/

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

Answer 2

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. 重新加载您的页面

您的鼠标现在将显示为模糊圆圈.点击"触摸".