13

我正在尝试为移动设备制作一个页面,该页面检测scrollTop位置并在scrollTop低于文档高度的一半时滚动到页面顶部,如果不是则滚动到底部。

我通过使用这个实现了这一点:

var ScrollTimeout;
$(window).on('scroll',function(){
    clearTimeout(ScrollTimeout);
    ScrollTimeout = setTimeout(scrollToTopOrBottom,200);
    });

问题是当用户停止滚动但手指仍然在屏幕上时会触发超时。

然后我参加了这个touchend活动,这很棒。

$(document).on('touchend',function(){
    scrollToTop();
    });

用户可以停止滚动(手指仍在屏幕上),然后继续滚动而不触发该scrollToTopOrBottom()功能。

问题是,该事件在浏览器之间不一致:

在某些浏览器(Maxthon 和 Android)中,该touchend事件按预期工作,但在 Opera Mobile 和 Chrome 中,该touchend事件不会触发。对此的解释是touchend不会触发,因为touchcancel之前已经触发过

我试过这个

$(document).on('touchmove',function(e){
    e.preventDefault();
    });

并成功避免了触发touchcancel,但不幸的是也避免了滚动的自然行为。

有谁知道如何做到这一点?我完全没有想法。

谢谢。

4

2 回答 2

20

尝试在 touchend 和 touchcancel 上附加监听器。

$(document).on('touchend touchcancel', function() {
    doSomthing();
});
于 2014-02-14T13:48:14.617 回答
1

我写了一个垫片来处理这个问题对你来说可能有点晚了,但它可能会对某人有所帮助。 https://github.com/TNT-RoX/android-swipe-shim

于 2014-08-12T10:02:28.590 回答