Javascript 在 PC 浏览器上模拟触摸事件
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4919191/
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 touch events on a PC browser
提问by eshalev
I am developing an HTML application for the iPad. As such it utilizes touch events and webkit-CSS animations.
我正在为 iPad 开发 HTML 应用程序。因此，它利用触摸事件和 webkit-CSS 动画。
Up until now I have used chrome as my debugging environment because of it's awesome developer mode.
到目前为止，我一直使用 chrome 作为我的调试环境，因为它是非常棒的开发人员模式。
What I would like is to be able to debug my Html/JavaScript using Google-Chrome's debugger on my PC while simulating touch events with my mouse.
我想要的是能够在我的 PC 上使用 Google-Chrome 的调试器调试我的 Html/JavaScript，同时用我的鼠标模拟触摸事件。
My site does not have any multi-touch events and no mouse events (no mouse on iPad).
我的网站没有任何多点触控事件，也没有鼠标事件（iPad 上没有鼠标）。
I am not actually interested in seeing the applications layout, but more in debugging its behavior.
我实际上对查看应用程序布局不感兴趣，但更多的是调试其行为。
Is there some plugin to get mouse events translated into touch events on a desktop browser?
是否有一些插件可以将鼠标事件转换为桌面浏览器上的触摸事件？
回答by Simon Sarris
As of April 13th 2012
截至 2012 年 4 月 13 日
In Google Chrome developer and canary builds there is now a checkbox for "Emulate touch events"
在 Google Chrome 开发人员和金丝雀版本中，现在有一个“模拟触摸事件”复选框
You can find it by opening the F12 developer tools and clicking on the gear at the bottom right of the screen.
您可以通过打开 F12 开发人员工具并单击屏幕右下角的齿轮来找到它。
For now (Chrome ver.36.0.1985.125) you can find it here: F12 => Esc => Emulation.
目前（Chrome ver.36.0.1985.125）你可以在这里找到它：F12 => Esc => Emulation。
回答by Vlad
The desktop browser can simulate touch events by importing additional JS + CSS. Take a look at:
桌面浏览器可以通过导入额外的 JS + CSS 来模拟触摸事件。看一眼：
回答by bishbashbosh
We use this script: http://code.google.com/p/jquery-ui-for-ipad-and-iphone/It will allow all mouse events in your application to be triggered by touch events instead. So, since we already had a web application that used right-clicking, drag-n-drop etc. it allowed us to perform all of the same functionality with touch.
我们使用这个脚本：http: //code.google.com/p/jquery-ui-for-ipad-and-iphone/它将允许您的应用程序中的所有鼠标事件由触摸事件触发。因此，由于我们已经有一个使用右键单击、拖放等方式的 Web 应用程序，它允许我们通过触摸来执行所有相同的功能。
I know it's almost the reverse of the simulation you were looking for (you will have to script your application to primarily be used by a mouse) but I hope it helps anyway.
我知道这几乎与您正在寻找的模拟相反（您必须编写主要由鼠标使用的应用程序脚本），但我希望它无论如何都会有所帮助。
回答by Corne
Another way to simulate multi touch on a desktop browser is the Touch Emulator of Hammer.js
在桌面浏览器上模拟多点触控的另一种方法是Hammer.js的Touch Emulator
回答by John Paul Barbagallo
I came across this little library based on the JQ UI lib. Pretty nifty:
我遇到了这个基于 JQ UI 库的小库。相当漂亮：
回答by Ryan McGrath
If you're targeting Webkit specifically (iPad and all), you can rely on normal event handler code (add/removeEventListener). With that in mind, you probably need to just branch on a few events - e.g, 'ontouchstart' becomes 'onclick' based on the environment.
如果您专门针对 Webkit（iPad 和所有产品），则可以依赖正常的事件处理程序代码（添加/删除事件侦听器）。考虑到这一点，您可能只需要对一些事件进行分支——例如，根据环境，“ontouchstart”变成“onclick”。
Offhand I don't know of any libraries providing this level of branching, though. Pretty easy to do yourself.
不过，我不知道有任何图书馆提供这种级别的分支。很容易自己做。
