如何在jQuery中滚动或滚动加载更多数据?

时间:2014-04-14 06:09:59

标签: javascript jquery

我想在滚动内容时加载更多数据。我从这里找到了一个解决方案: jQuery load more data on scroll

我想使用jQuery Waypoint插件。我们可以在滚动时加载更多数据,并在这个小提琴中实现吗?

http://jsfiddle.net/N5LZB/32/

var pages = [page_1, page_2, page_3, page_4, page_5];

var count=0;
$("#preRealTimeContents").html(pages[count]);

$("#realTimeContents").html(pages[count+1]);

1 个答案:

答案 0 :(得分:0)

试试这个,

var scrollFlag=true;
$('#fullContainer').scroll(function () {
    if (scrollFlag && this.scrollHeight - $(this).scrollTop() - $(this).offset().top - $(this).height() <= 0) {
        count++;
        if (count >= pages.length) scrollFlag = false;
        $("#preRealTimeContents").append(pages[count]);
    }
});

Non-circular live demo

已更新在滚动时加载所有div一次,

var pages = [page_1, page_2, page_3, page_4, page_5];
var count = 0;
$("#preRealTimeContents").html(pages[count]);
var scrollFlag=true;
$('#fullContainer').scroll(function () {
    for(i=1,len=pages.length;i<len;i++,count++) {
        if (count >= len) break;
        $("#preRealTimeContents").append(pages[count]);
    }
});

Demo