Question

我正在通过滚动实现按需加载数据。

我在document.ready中注册了div的功能。

只有在滚动到达最后一个时才应填充数据。所以要确定滚动是否已到达，直到最后我使用以下功能。

$("#tree").scroll(function () {
                if (isScrolledToBottom(this)) {

                }
            });

但该函数未返回正确的值。我的意思是当滚动到达最后一个时它应该返回一个真值。

function isScrolledToBottom(object) {
            return ($(object).attr('scrollHeight') - $(object).scrollTop() - 1) <= $(object).height();
        };

Answer 1

请改为尝试：

return ($(object).attr('offsetHeight') + $(object).attr('scrollTop') >= $(object).attr('scrollHeight'));

Answer 2

如果您想进行无限滚动，请在此处查看我的答案： How to load the web page content based on user scrolling

此演示在某个Y滚动位置触发。如果您希望在用户到达某个项目时专门完成此操作，您可能需要查看Waypoints插件。

http://imakewebthings.com/jquery-waypoints/

无限滚动演示：http://imakewebthings.com/jquery-waypoints/infinite-scroll/

$('.theItems:last').waypoint(function(event, direction) {
    //Ajax fetch here
});

Answer 3

 var scrollHeight = $(object).prop("scrollHeight"); // total scrollable height of the element 
    var scrollTop = $(object).scrollTop(); // how far you have come from the top while scrolling vertically
    var height =  $(object).height(); // the constant height of the portion in display at all times

    if (scrollHeight === (scrollTop + height)) {
        //console.log("fetching page");
        fetchNextPage();
    }

按需滚动加载数据

3 个答案: