模拟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事件。例如，Windows8已经在移动市场占据了平板电脑市场，它使用了一个由指针组成的更抽象的事件模型。

Answer 2

Chrome Dev- Chrome浏览器中的工具允许你模拟触摸事件。参见https://developers.google.com/chrome-developer-tools/docs/mobile-emulation。

从文件里..。

模拟触摸事件

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

此问题的一个解决方案是在您的开发计算机上模拟触摸事件。对于单点触控，Chrome DevTools支持单点触控事件模拟，使得在桌面上调试移动应用程序变得更容易。

要从Chrome浏览器使用(从版本29.0.1547.65开始)：

1. 选择浏览器窗口右上角的Chrome菜单(三行堆叠)。
2. 选择工具>开发人员工具。(快捷方式Shift+Control+I)

工具窗口将出现在底部，并选中Console选项卡。

• 在底部右击设置齿轮(看起来像齿轮)。

将出现一个设置面板，顶部有"General“。按一下左边的" overrides“以选择overrides panel.

• Scroll events"

• Reload

• 并选中"Enable touch events”

• Reload

“。

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

Answer 3

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