php下拉自动刷新,下拉加载刷新thinkphp代码设计（防游品味）

具体demo这里就不提供了，具体效果可以去游品味上看，只说一下设计原理，大家将就看一下。

代码中的下一页和总页码都是后台计算得到的。

首先是JS代码如下：

$(function(){

//数据是否在加载中

var isLoading = false;

//加载次数

var count = 0;

//滚动加载次数

var scrollCount = 2;

//检测

function loadMore(){

$(window).scroll(function(e){

//只需滚动加载5次

if(count > scrollCount) return;

var domH = $(document).height();

var sTop = $(document.body).scrollTop();

var h = $(window).height();

if(domH < (sTop + h + 300)){

loadMoreGame();

}

});

}

//加载更多游戏

function loadMoreGame(){

//如果正在加载中，则返回

if(isLoading) return;

isLoading = true;

var $loadMore = $("#loadMore");

var url = $loadMore.attr("next-page");

var next = $loadMore.attr("next");//获取下一页

var pagenum = $loadMore.attr("pagenum");//总页码

if(parseInt(next)>parseInt(pagenum)){

$(".loading").text("没有了");

return;

}

$.ajax({

url:url,

success:function(result){

if(result){

var $obj = $("

"+result+"

");

$obj.find(".section-bd .evaluate-list .item").appendTo($(".evaluate-list"));

var nurl = $obj.find(".ypw-load-more").attr("next-page");

//设置下一页的url

$loadMore.attr("next-page",nurl);

var next = $obj.find(".ypw-load-more").attr("next");

$loadMore.attr("next",next);

isLoading = false;

//加载次数增加一次

count ++;

if(count > scrollCount){

$loadMore.find(".loading").hide();

//大于5次则点击加载

$loadMore.find(".load").show().click(function(){

$loadMore.find(".loading").show();

$(this).hide();

//加载更多游戏

loadMoreGame();

});

}

}

}

});

}

})

html代码大致如下：

• 

  {fy_$item.username}

  {fy_$item.fpclick}

  {fy_$item.fpcreatetime|date="Y-m-d h:i",###}

  {fy_$item.fptitle}

  {fy_$item.fpcontent|strip_tags|iconv_substr=0,60,'utf-8'}

  • {fy_$item.frnum}

  • {fy_$item.fpclick}

正在加载 请稍后···

点击加载更多

接口返回代码设计：

• 

  {fy_$item.username}

  {fy_$item.fpclick}

  {fy_$item.fpcreatetime|date="Y-m-d h:i",###}

  {fy_$item.fptitle}

  {fy_$item.fpcontent|strip_tags|iconv_substr=0,60,'utf-8'}

  • {fy_$item.frnum}

  • {fy_$item.fpclick}

正在加载 请稍后···

喜欢 (2)or分享 (0)