0

我试图在网站中实现无限滚动功能。有一个 div '#books'，里面有多个 div '.book'。到目前为止，这工作正常：

alreadyloading = false;
nextpage = 1;

$(window).scroll(function() {
if ($('body').height() <= ($(window).height() + $(window).scrollTop())) {
    if (alreadyloading == false) {
        var url = "page"+nextpage+".html";
        alreadyloading = true;
        $('#books').append($('#loadinggif').fadeIn(200));
        $.post(url, function(data) {
            $('#books').append(data);
            alreadyloading = false;
            nextpage++;
            $('#loadinggif').fadeOut(200);
        });
    }
}
});

但是，即使在加载所有内容后，#lodinggif 也会停留在底部。有什么方法可以检测到 pagex.html 不存在然后隐藏 #loadinggif ？

4

2 回答 2

1

除了数据之外，服务器还需要提供此信息。因此，您可以让服务器返回一个 XML 或 JSON 文件，其中包含数据以及下一页是否实际存在。

于 2012-03-22T06:17:11.777 回答
1

如果您阅读jQuery.post()的文档，它会说明回调：

success(data, textStatus, jqXHR)
请求成功时执行的回调函数。

所以你不能用$.post. 但是您可以使用长格式jQuery.ajax()而不是 post 简写来捕获它们：

$.ajax({
    url: url,
    type: 'post',
    success: function(data, textStatus, jqXHR) {
        $('#books').append(data);
        nextpage++;
        alreadyloading = false;
        $('#loadinggif').fadeOut(200);
    },
    error: function(jqXHR, textStatus, errorThrown) {
        alreadyloading = false;
        $('#loadinggif').fadeOut(200);
    }
});
于 2012-03-22T06:18:52.563 回答