滚动到距离页面底部固定高度时动态添加更多数据

此效果是避免滚动到固定位置多次添加的问题

 

  
   var  caseStatus=true;  //是否追加
   var  casePageNum=0;  //分页页数
　　//评价滚动到底部追加
        $(window).scroll(function () {
            var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;
            //判断是否滚动到底部
            if (scrollTop + window.innerHeight+700> document.body.offsetHeight) { //700 表示距离底部多少的距离的开始触发加载更多效果
                //加载更多
                if (caseStatus==true) { //防止多次加载
                        caseStatus=false
                        casePageNum=casePageNum+1
                        caseMore(casePageNum)
                    }

            }
        })

  　　　　//加载更多方法
        function caseMore(page) {
            $.getJSON('/api.php?op=six&diID={$diID}&type={$type}&pagesize=9&page='+page, function(data) {
                console.log(data)
                if(data!=null) {

                    $.each(data, function (j) {
                        i++;
                            var titleText=data[j].title;//标题
                            var areaText=data[j].pm; //面积
                            var type1=data[j].fg; //风格
                            var thumb=data[j].thumb  //图片
                            var url=data[j].url  //跳转路径

                        var html=`<div class="institute-case-item">
                        <a href="${url}">
                            <div class="institute-case-top"><img alt="${titleText}" src="${thumb}" class="institute-case-img"></div>
                            <div class="institute-case-con">
                                <p class="institute-case-title">${titleText}</p>
                                <div class="institute-case-text"><span>${type1}</span><span>${areaText}㎡</span></div>
                            </div>
                        </a>
                    </div>`;

                        $(".institute-tab-case").append(html);
                        caseStatus=true
                    });

                }else{
                    console.log("没有数据了")
                }


            });
        }

 

转载于:https://www.cnblogs.com/shanshanjiadexiaohai/p/11187435.html