Javascript支持触摸而不阻塞浏览器支持

我有一个小的网络图库，我为移动浏览器添加了滑动导航。我通过非常简单的touchstart/touchmove/touchend事件跟踪实现了这一点

问题是，当我尝试在浏览器窗口中收缩缩放时，如果在我添加了触摸事件处理程序的元素中有任何手指启动，它就会失败，我从对默认值的调用中猜测

是否有一种方法可以跟踪触摸事件，以便在不阻止浏览器放大和缩小功能的情况下导航图像？如果在我的元素上，我不介意阻止单指滚动，但我想允许收缩缩放

代码如下：

  function addDragHandlers(eventDivId) {
    var startX, endX;
    var slides = $('#'+eventDivId);

    slides.bind('touchstart', function(e) {
        e.preventDefault();
        startX = e.pageX;
        endX = startX;
    });

    slides.bind('touchmove', function(e) {
        e.preventDefault();
        endX = e.pageX;
    });

    slides.bind('touchend', function(e) {
            e.preventDefault();
            if ( endX - startX < 0) {
                // go to next image
            } else if ( endX - startX > 0) {
                // go to previous image
            } else {
                // do click action
            }
        }
    });
 }

函数addDragHandler（eventDivId）{
var startX，endX；
var slides=$（“#”+eventDivId）；
slides.bind（'touchstart'，函数（e）{
e、 预防默认值（）；
startX=e.pageX；
endX=startX；
});
slides.bind（'touchmove'，函数（e）{
e、 预防默认值（）；
endX=e.pageX；
});
slides.bind（'touchend'，函数（e）{
e、 预防默认值（）；
如果（endX-startX<0）{
//转到下一个图像
}否则如果（endX-startX>0）{
//转到上一张图片
}否则{
//执行单击操作
}
}
});
}

您需要的是ongesturestart、ongesturestart move和end work，与触控相同，但适用于多个手指。您可以从其列表中为以下内容添加侦听器：

event.stopPropagation();

---

为了防止“preventDefault（）”在中传播。

我希望它能在Android上运行，所以我不想使用手势事件，我读到的手势事件只在iOS上发生——尽管我没有Android来测试这一说法

然后我看了一些javascript手势库，它们试图使手势支持变得简单。不幸的是，它们中没有一个能很好地满足我的需要

因此，我最终使用了身体上的触摸处理程序来跟踪页面上的所有触摸，然后使用一个定制的启发式方法来确定是使用触摸来导航图库还是使用触摸来滚动/挤压页面

它仍然不完美。如果您先触摸“我的画廊”元素，然后再触摸其外部，则挤压不起作用

---

顺便说一句，“TouchWipe”jquery库有一个设计得非常好且灵活的API，但由于我需要的配置，只跟踪元素上的水平滑动，所以在iOS6下它太古怪了，已经有几周没有更新了。如果您正在研究这类挑战，并且距离现在还有几个月的时间，我建议您检查该插件的更新。

Android是否支持OnEstureStart？不，Android仍然不支持手势