Yii中的无限滚动

Question

我正在寻找一种解决方案，以便在Yii的列表视图中显示许多项目（十万个）。我希望能够在不断滚动的列表中显示它们。这里有一个问题，当用户滚动到列表末尾时，我希望新数据替换刚刚滚动的数据。有点像谷歌音乐，如果你有一个非常长的播放列表。

我看着Yiinfinite-scroller，但它追加到列表的最后列出了一个很长的列表，它正在杀死我的内存使用情况。

感谢

Answer 1

它实际上很容易实现，在短短的几行JS和使用jQuery的帮助下无限滚动。测量内容div的高度，当页面卷动从divs高度减去滚动差异，然后当它达到最小值时查询更多内容并重置高度计数器并重复：

<script type="text/javascript"> 
var contentHeight = 4000,; 
var pageHeight = document.documentElement.clientHeight; 
var scrollPosition; 
var n = 1; 

function scroll(){ 
    if(navigator.appName == "Microsoft Internet Explorer") 
     scrollPosition = document.documentElement.scrollTop; 
    else 
     scrollPosition = window.pageYOffset; 

    if((contentHeight - pageHeight - scrollPosition) < 500){ 
     $.ajax({ url: "./yourAPI/?next="+n, cache: false, 
     success: function(data){ 
      //append result 
      $('#infscroll').append('<div>'+data.result+'</div>'); 
     }, dataType: "json"}); 
     n += 1; 
     contentHeight += 4000; 
    } 
} 

$(document).scroll(function(){ 
    setInterval('scroll();', 250); 
}); 
</script> 

<div id="infscroll"></div>