1

我有这个用于加载数据的代码。当用户向下滚动半个屏幕时，它会继续加载数据并将 HTML 附加到文档中。The problem is $(window).height() doesn't update on the fly after HTML changes所以条件表达式出错了。如何解决？

// Check scrollbar is down a half.
$(window).scroll(function() {
    console.log("flag: " + flag);       
    console.log($(window).scrollTop());
    console.log($(window).height());

    if (($(window).scrollTop()  > $(window).height() / 2)) { 
        if(flag == 0) {
            console.log("Load data");
            loadData(globalIndex, globalCount);
            globalIndex += 40;
        }
        flag = 1;

    } else {
        flag = 0;
    }
});
4

2 回答 2

2

除非您调整浏览器屏幕的大小，否则窗口的高度不会改变。您的公式的问题在于，为了使其正常工作，您需要加载足够的数据以将滚动条移回中点上方。如果您不这样做，此公式将不断返回 true，并且您调用 loadData 的次数将远远超出您的意料。

作为一种潜在的解决方法（取决于加载数据所需的时间），您可以在滚动条到达窗口底部时调用 loadData。这种情况的发生频率远低于您当前的情况，并且仅当您的用户尝试查看数据时才会加载数据。如果数据加载速度很快，那么这是一个简单的解决方案。如果这是一个耗时的过程，这就是您选择在中途加载数据的原因，然后考虑一次加载更多数据，并包括一个微调器或其他一些视觉线索来通知用户数据是加载。

于 2013-05-28T02:13:43.787 回答
1 
$(window).height()

将为您提供浏览器的高度（除非您调整窗口大小，否则该高度是恒定的）。尝试使用：

$(document).height() - ($(window).height()/2);

反而...

于 2013-05-28T01:55:09.267 回答