Zepto的SwipeUp 在 android 和微信 的解决方案

Zepto的SwipeUp 在 android 和微信 的解决方案

时间:2016-04-19 22:20:09

作者:zhongxia

---

问题解决方案:

Q:为什么swipeUp和swipeDown在手机测试不成功？？

A: 把这段代码添加到 zepto.min.js 的最上面

document.addEventListener('touchmove', function (event) { event.preventDefault(); }, false);

这段代码还是有问题:   内容太长出现滚动条之后, 没有办法滚动

做公司的一个手机站，发现zepto的touch.js在安卓上的兼容性有bug，主要是在微信上无法触发swipe*事件，而且这个 bug 作者不愿意修，理由是：我特么没有安卓设备。发生这种bug的原因大概是安卓设备上

网上找到了一个大神的初步解决方案：在touch.js中加一段代码：

.on('touchmove MSPointerMove pointermove', function(e){
        if((_isPointerType = isPointerEventType(e, 'move')) &&
          !isPrimaryTouch(e)) return
        firstTouch = _isPointerType ? e : e.touches[0]
        cancelLongTap()
        touch.x2 = firstTouch.pageX
        touch.y2 = firstTouch.pageY

        deltaX += Math.abs(touch.x1 - touch.x2)
        deltaY += Math.abs(touch.y1 - touch.y2)

        /**
         * 修复 android 4.4 swipe 事件
         * https://github.com/madrobby/zepto/issues/315#issuecomment-8386027
         */
        if (touch.x2 && Math.abs(touch.x1 - touch.x2) > 10)
            e.preventDefault()
      })

虽然说这点代码, 但是这段代码要放在什么地方呢?

加载 自执行函数里面的  $(window).on 的绑定事件上

DEMO: http://zhongxia245.github.io/demo/ZeptoTouch/index.html

可以在微信扫码,打开试一下,Android 的浏览器同样可以试一下