javascript 模拟 touchstart 和 touchend 事件？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10406783/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Simulating touchstart and touchend events?
提问by user1184100
I'm developing a jquery component which works primarily for ipad. So is there anyway to simulate 'touchstart and 'touchend' events in desktop rather than having the device itself to check the events.
我正在开发一个主要用于 ipad 的 jquery 组件。那么无论如何要在桌面上模拟“touchstart”和“touchend”事件，而不是让设备本身来检查事件。
采纳答案by Sampson
You can author your own custom events within jQuery:
您可以在 jQuery 中创作自己的自定义事件：
var event = $.Event( "touchstart", { pageX:200, pageY:200 } );
And you can issue them against any element in the DOM:
您可以针对 DOM 中的任何元素发出它们：
$("body").trigger( event );
Demo: http://jsbin.com/ezoxed/edit#javascript,html
Further reading: http://api.jquery.com/category/events/event-object/
演示：http: //jsbin.com/ezoxed/edit#javascript,html
进一步阅读：http: //api.jquery.com/category/events/event-object/
Keep in mind that there are various other types of interfaces on the market now that don't support touchstartand touchendevents. For instance, Windows 8 is already occupying tablets in the mobile market, and it uses a more abstracted event model consisting of Pointers.
请记住，现在市场上还有各种其他类型的接口不支持touchstart和touchend事件。例如，Windows 8 已经占领了移动市场的平板电脑，它使用由指针组成的更抽象的事件模型。
回答by Thaddeus Albers
Chrome Dev-tools within a Chrome Browser allows you to emulate touch events. See https://developers.google.com/chrome-developer-tools/docs/mobile-emulation.
Chrome 浏览器中的 Chrome 开发工具允许您模拟触摸事件。请参阅https://developers.google.com/chrome-developer-tools/docs/mobile-emulation。
From the docs...
从文档...
Emulating Touch Events
Touch is an input method that's difficult to test on the desktop, since most desktops don't have touch input. Having to test on mobile can lengthen your development cycle, since every change you make needs to be pushed out to a server and then loaded on the device.
A solution to this problem is to simulate touch events on your development machine. For single-touches, the Chrome DevTools supports single touch event emulation to make it easier to debug mobile applications on the desktop.
模拟触摸事件
触摸是一种很难在桌面上测试的输入法，因为大多数桌面没有触摸输入。必须在移动设备上进行测试会延长您的开发周期，因为您所做的每项更改都需要推送到服务器，然后再加载到设备上。
此问题的解决方案是在您的开发机器上模拟触摸事件。对于单点触控，Chrome DevTools 支持单点触控事件模拟，可以更轻松地在桌面上调试移动应用程序。
To use from a Chrome browser (as of version 29.0.1547.65):
要从 Chrome 浏览器使用（从 29.0.1547.65 版开始）：
- Select the Chrome menu at the top-right of your browser window (three stacked lines).
- Select Tools > Developer tools. (Shortcut Shift+Control+I)
A tools window will appear on the bottom with the tab Console selected. - In the bottom right click on the settings cog (look like a gear).
A setting panel will appear with "General" on top. - Click "Overrides" on left to select overrides panel.
- Scroll down and check "Enable touch events"
- Reload your page
- 选择浏览器窗口右上角的 Chrome 菜单（三行堆叠）。
- 选择工具 > 开发人员工具。（快捷键 Shift+Control+I）
底部会出现一个工具窗口，其中选择了选项卡控制台。 - 在右下角单击设置齿轮（看起来像齿轮）。
将出现一个设置面板，顶部有“常规”。 - 单击左侧的“覆盖”以选择覆盖面板。
- 向下滚动并选中“启用触摸事件”
- 重新加载您的页面
You mouse will now appear as a fuzzy circle. Click to "touch".
您的鼠标现在将显示为一个模糊的圆圈。点击“触摸”。
回答by prusswan
As of 2018, Chrome DevTools supports device emulation outright, without any need for override setting. Just toggle the device toolbar (Ctrl + Shift + M) to get the browser into mobile mode, then touch events can be triggered by the mouse.
截至 2018 年，Chrome DevTools 完全支持设备模拟，无需任何覆盖设置。只需切换设备工具栏（Ctrl + Shift + M）即可使浏览器进入移动模式，然后鼠标即可触发触摸事件。
