2017-04-12 43 views
0

我使用Ajax调用像这样从WordPress站点获取用户数据:懒滚动装载在Ajax调用

$.ajax({ 
    url:"http://..../wordpress/wp-json/wp/v2/users", 
    type: 'GET', 
    dataType: 'JSON', 
    data: {limit: 6, order: 'asc'}, 
    success : function(data){ 
    for(i=0; i < data.length; i++){ 
    $('div.about-us').append('<div class="col-md-4 single-grid '+data[i].id+'" onclick="myFunction(\'' + data[i] + '\')"><div class="col-md-11 text-center"><img src="'+data[i].profileImage+'"><h4>'+data[i].name+'</h4><strong>'+data[i].job_title+'</strong></div></div>'); 
    } 

    } 

我动态追加每一个数据。我在这里有很多数据“http://..../wordpress/wp-json/wp/v2/users”。我最初只需要6行,如果向下滚动它应该加载另外6行。我不想使用jquery插件。总的来说,我想要的是惰性滚动加载没有任何插件。

回答

0

使用这样的事情:

var scrollLimit = 500; // Amount after which ajax() call initializes 
var limit  = 3; // item count 
var offset  = 6; // offset 
$(window).on('scroll', function() { 
    scrollPosition = $(this).scrollTop(); 
    if (scrollPosition >= scrollLimit) 
    { 
     loadContent(limit, offset); // loadContent method in which ajax() call is defined 

     // Update values on each scroll 
     scrollLimit = scrollLimit + 500; 
     offset = offset + 3; 
    } 
}); 
+0

即使我指定限制为6它给我所有的行。 –

+0

然后问题在您的服务器端查询。 @SwapnilPatil –

+0

你必须在服务器端发送'limit,offset'值,并在带有LIMIT和OFFSET的查询中使用它 –

0

而是限制:6试过这样:

data : {per_page:6, page:page_no} 

解决我的问题。谢谢