Question

我构建了一个触摸/鼠标友好的jQuery插件。它适用于手机（ios，android ...）和桌面浏览器。但我在触摸屏笔记本电脑上安装Windows 8 Chrome时遇到了一些问题。不幸的是我没有这样的设备，也无法进行任何测试。IE10工作正常。

让我向你解释一下我的内容（非常简化的代码）：

1.检查是触摸设备：

base.isTouch = ("ontouchstart" in document.documentElement);

2.获取适当的活动

if(base.isTouch === true){
    //use touch events:
    "touchstart.owl",
    "touchmove.owl",
    "touchend.owl"
} else {
    //usemouse events
    "mousedown.owl",
    "mousemove.owl",
    "mouseup.owl"
}

3.检查触摸事件：

if(base.isTouch === true){
    x = event.touches[0].pageX
    y = event.touches[0].pageY
} else {
    x = event.pageX
    y = event.pageY
}

link to real code

我认为chrome的问题在于检测我的触摸事件，但是使用鼠标事件并将其转换为触摸。

我可以一起添加鼠标和触摸事件：

$('elem').on('mousedown.owl touchstart.owl',func);

哪个好，但我遇到了event.touches [0] .pageX

的问题

link to plugin landing page

谢谢！

问题已解决

要在Windows 8 Chrome和触摸屏上一起使用鼠标和触摸事件，我必须：

1.在一个元素上添加两个事件“touchstart.owl mousedown.owl”

2.检查“event.touches”：

if(event.touches){
    x = event.touches[0].pageX
    y = event.touches[0].pageY
} else {
    x = event.pageX
    y = event.pageY
}

Answer 1

要在Windows 8 Chrome和触摸屏上一起使用鼠标和触摸事件，我必须：

1.在一个元素上添加两个事件“touchstart.owl mousedown.owl”

2.检查“event.touches”：

if(event.touches){
    x = event.touches[0].pageX
    y = event.touches[0].pageY
} else {
    x = event.pageX
    y = event.pageY
}

Answer 2

最简单的解决方案是包含Touch Punch插件http://touchpunch.furf.com/

我为我的项目做了它并且运行良好 - 你可以测试它，这是我的项目： http://englishtotheworld.com/

使用触摸屏在Windows 8上检测Chrome中的触摸事件

2 个答案: