javascript - 对触摸的Java脚本支持不阻止浏览器捏支持

我有一个小型网络画廊，向移动浏览器添加了滑动导航。我通过非常简单的touchstart / touchmove / touchend事件跟踪来做到这一点。

问题是，当我尝试在浏览器窗口中进行缩放时，如果在我添加了触摸事件处理程序的元素中有任何手指开始操作，它将失败，我从对preventDefault的调用中猜到了。

有没有一种方法可以跟踪触摸事件以导航图像，而又不会阻止浏览器的放大和缩小功能？我不介意在元素上方滚动阻止单指滚动，但我想允许捏缩放。

这是代码：

  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
            }
        }
    });
 }

最佳答案

您需要的是ongesturestart，ongesturestart的移动和结束工作与触摸时相同，但要用一根以上的手指。从他们可以为以下人员添加侦听器：

event.stopPropagation();

防止“ preventDefault（）”传播。