Question

我想在jquery移动网络应用程序中创建无限滚动。我想在不使用ajax的情况下滚动页面。是否有可能这样做？

Answer 1

如果您的数据不是真的无限，您可以将所有内容存储在页面中并显示需要显示的内容。

例如（未经测试，但为了给你一个想法）：

<强> HTML

<div class="scrollable-data"><!-- ... --></div>
<div class="scrollable-data"><!-- ... --></div>
<div class="scrollable-data"><!-- ... --></div>
<div class="scrollable-data"><!-- ... --></div>

<强>的jQuery

var $doc=$(document);
var $win=$(window);

// hide everything that is out of bound
$('.scrollable-data').filter(function(index){
    return ($(this).scrollTop() > $doc.height());
}).hide();

var DATA_INCREMENT=5;

$(window).scroll(function(){
    // test if at the bottom
    if ($doc.height()-$win.height()-$(this).scrollTop() == 0) {
        // show the <DATA_INCREMENT> (5) next hidden data tags
        $('.scrollable-data:hidden:lt('+DATA_INCREMENT+')').show();
    }
});

希望这有帮助。

使用jquery没有ajax的无限滚动？

1 个答案: