正常情况:
重复显示后:
产生问题的原因:queryActs()----queryActsAdd() 进入到改方法中了,但是还没走到flag=false的时候,scoll触发,此时的flag = true,因此又加载了一次queryActsAdd方法。【是不是就是类似于高并发的时候没有加锁导致的数据异常】
解决方案:加loading标志位,
与flag(原有)标志位的区别:详情见代码
加锁!!!!
var flag = true;
var loading=false;
queryActs();
function queryActs(){
pageNum = 1;
flag = true;
$("#acts_timeline").html("");
!loading&&queryActsAdd();
}
function queryActsAdd() {
var uid =
var url =
loading=true;
$.ajax({
type : "POST", // 提交方式
// async:false,
data : {
pageNum : pageNum,
level : activityLevel,
status : activityStatus
},
dataType : 'json',
url : url,
success : function(obj) {// 返回数据根据结果进行相应的处理
var totalRecord = obj.total;
$("#total_record").html(totalRecord); //设置总数
loading=false;
//无活动数据时
if(totalRecord==0){
//显示无活动提示图片
$("#acts_timeline").append("<div class='act-no tc'>现在还没有活动哦~~</div>");
flag = false;
}else{ //有活动数据时
var totalPages = obj.pages; //总页数
if(obj.pageNum >= totalPages){
flag = false;//当和总页数相等时不再滚动加载
}
var htmlTemp = template('actsTimelineTemplate', obj);
$("#acts_timeline").append(htmlTemp);
}
}
});
}
//滚动加载数据
$(window).scroll(function() {
if ($(document).scrollTop() >= $(document).height() - $(window).height()) {
console.log(flag);
if(flag===true){
pageNum = pageNum + 1;
!loading&&queryActsAdd();
}
}
});