javascript - 滚屏加载数据重复加载问题-PHP中文网问答

文章专题 AI工具学习下载问答源码最近更新

PHP

会员中心讲师中心微信公众号

javascript - 滚屏加载数据重复加载问题

天蓬老师 2017-04-10 14:35:59

[JavaScript讨论组]

622

自己写了个滚动加载的代码但是出现一个问题就是滚动会重复加载，请问如何使页面不重复加载

$(window).on('scroll', function () {
  var btnflag=true;
  if($(document).scrollTop() + $(window).height() > $(document).height() - 100){
    push();
    if(btnflag){
      btnflag=false;
      push();
    }
  };
})
function push() {
//ajax添加数据相关
  btnflag=true;
}

滚动时候数据会重复加载

天蓬老师

欢迎选择我的课程，让我们一起见证您的进步~~

全部回复(1)

高洛峰2017-04-10 14:37:59 1楼

从你的代码来看，在每一次的scroll事件中，你的btnflag始终为true，根本没有起到标识变量的作用。我对代码稍作了些修改，供参考。

var loading = false;
$(window).on('scroll', function () {
  if($(document).scrollTop() + $(window).height() > $(document).height() - 100){
    if(!loading){
      push();
    }
  };
})
function push() {
  //ajax添加数据相关
  loading = true;
  $.ajax(...)
   .done(function () {
     loading = false;
   });
}