1
$(window).scroll(function() {
        var yDistance = $('html, body').scrollTop();
        //var el = $(this).get(0);
        //if (el.offsetHeight + el.scrollTop >= el.scrollHeight) {
        //if ((yDistance + $(window).height()) > ($.mobile.activePage.children('.ui-content').height() - 150)) {
        if ($(window).scrollTop() == $(document).height() - $(window).height()) {

            if (!lastIndexReached) {
                pageIndex++;
                GetWallpapers(pageIndex, pageSize);
            }
        }
    });

在上面的代码中,我正在做的是当页面滚动到页面底部时,将调用一个新的 ajax 请求并将其附加到列表中。这适用于至少在我的浏览器和模拟器中的所有地方,但是当我在 google nexus 7 上运行它,它没有触发。我用谷歌搜索并尝试了一些修复,这些修复在代码段中进行了评论,但没有帮助。

我正在使用 jquerymobile + phonegap。

4

2 回答 2

0

我创建了一个方法并像这样调用它

setInterval('checkScroll()',1000);

function checkScroll() {
    if ($(this).scrollTop() + $(this).height() >= ($(document).height() - 100)) {

        if (lastIndexReached == false && process==false) {
            process = true;
            console.log(pageIndex);
            pageIndex++;
            GetWallpapers(pageIndex, pageSize);
        }
    }
}

每次滚动位于底部时,GetWallpapers() 方法被调用大约 10 次,所以我创建了一个变量进程,其值更改为 false,当调用 GetWallpapers() 方法时,它的值变为 true,并且当新的 html 附加到 dom我再次将其值设置为 false。

通过这种方式,我解决了我的问题,感谢@Ivan Ivković,感谢您的帮助。

于 2013-02-27T10:50:46.020 回答
0

对我来说,这个问题原来与视口设置有关。我并没有真正测试它,但我很确定关闭用户缩放是诀窍。这是我后人的完整视口标签:

<meta name="viewport" content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0'>

我也改用Ajax Infinite Scroll插件而不是 oldschoool Paul Irish 版本,但在我更改视口属性之前,该插件有同样的问题。

于 2015-08-20T19:09:15.080 回答