在Android浏览器上检测滚动事件

时间:2010-09-27 12:43:42

标签: javascript android event-handling scroll touch

我正在尝试在Android浏览器中检测滚动事件(我的特定版本是2.1,但是你希望它也适用于旧版本)。这似乎不可能!

我首先尝试过这个:

document.addEventListener('scroll', function(){ alert('test'); }, false);

但没有触发任何内容(页面加载时除外)。

我想:好吧,让我们疯狂并通过以下方式模仿它:  1.检测touchend  2.轮询window.pageYOffset,以便我们知道窗口何时停止滚动  3.在滚动时手动触发我想要的用户功能。

不幸的是,touchend事件看起来也不会被触发......实际上,当我们不滚动并只点击屏幕(touchstart + touchend)时,它就可以了。一旦我们在中间滚动页面(touchstart + touchmove + touchend),它就会破坏所有内容。

现在我最基本的例子只包含这个:

document.addEventListener('touchend', function(){ alert('test'); }, false);

但是当我们用手指滚动并释放触摸时,警报不会显示...

有人有建议吗?

感谢。

1 个答案:

答案 0 :(得分:2)

您可能希望抓取JQuery Mobile的源代码,它支持Android浏览器并具有滚动事件侦听器。

Or at least they say it does in the docs. :p

Here's the source

$.event.special.scrollstart = {
    enabled: true,

        setup: function() {
            var thisObject = this,
                $this = $( thisObject ),
                    scrolling,
                    timer;

            function trigger( event, state ) {
                scrolling = state;
                var originalType = event.type;
                event.type = scrolling ? "scrollstart" : "scrollstop";
                $.event.handle.call( thisObject, event );
                event.type = originalType;
            }

            // iPhone triggers scroll after a small delay; use touchmove instead
            $this.bind( scrollEvent, function( event ) {
                if ( !$.event.special.scrollstart.enabled ) {
                    return;
                }

                if ( !scrolling ) {
                    trigger( event, true );
                }

                clearTimeout( timer );
                timer = setTimeout(function() {
                    trigger( event, false );
                }, 50 );
            });
        }
};