如何使用jquery将按钮更改为无限滚动?

时间:2016-12-16 06:28:16

标签: jquery ajax

我有一个名为'getmore'的按钮类。第一个脚本工作正常。现在我如何在window.scroll函数中添加这个无限滚动。请帮忙

$(document).ready(function(){
    $('body').on('click','.getmore',function(){
        var lastelement = $(this ).attr('id');
        $.ajax({    			 
            type: 'GET',
            url: 'getmore.php',
            data:'lastelement=' + lastelement,
            beforesend: function() {
                $('.getmore').html('loading....');
            },		 
            success: function(data){
                $('.getmore').remove();
                $('#recs') .append(data) ; 
            }
        });
});

1 个答案:

答案 0 :(得分:0)

如果我理解正确,我认为这就是你所需要的

当滚动位于底部时,从服务器加载内容。

function LoadContent() {
  var resultString = $("#contentDiv").html();
  $(jsonObj).each(function(i, e) {
    for (j = 1; j < 101; j++) {
      resultString += "No: " + j + ", Name: " + e.Name + ", Age: " + e.Age + "<br/>";
    }
  });
  $("#contentDiv").html(resultString);
}
$(window).scroll(function(event) {
  if ($(window).scrollTop() + $(window).height() == $(document).height()) {
    LoadContent();
  }
});

请检查工作Fiddle