ajax 手机端滑动分页

最新推荐文章于 2023-12-19 11:55:30 发布

重案组之虎曹达华

最新推荐文章于 2023-12-19 11:55:30 发布

阅读量2k

点赞数

分类专栏： ajax

本文链接：https://blog.csdn.net/wtw945/article/details/80981248

版权

ajax 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

//滚动加载更多,tempHeight需要调整
        var tempHeight = 1000,
            timeoutId = 0,
            headerHeight = $(".header").height();
        $(window).on('scroll', function () {
            clearTimeout(timeoutId);
            timeoutId = setTimeout(function () {
                if (($(window).scrollTop() + window.innerHeight >= ($(document).height() - tempHeight)) && renderMoreFlag) {
                    renderMoreFlag = false;
                    renderMore();
                }
            }, 50)
        });

// 上滑加载商品
        function renderMore(){
            gameid = $("#js-gameid").val();     //列表ID
            sort = $("#js-sort").val();     //排序类型
            pageSize = parseInt($("#js-pagesize"); // 每页显示数量
            page = parseInt($("#js-page").val())+1; //当前页数
            $.ajax({
                type: "GET",
                url: "/zuhao/activity/ajaxgoods", //请求地址
                data: {
                    gameid:gameid,
                    pageSize:pageSize,
                    page:page,
                    sort:sort
                },
                dataType: "json",
                success: function(data){     //请求成功执行代码
                    $("#js-page").val(page);
                    if (data.number < pageSize) {   //数据剩余数量小于每页显示数量
                        $(".js-load-show").removeClass("hide");
                    }else{
                        renderMoreFlag = true;
                    }
                    if (data.number>0) {   //数据剩余数量大于每页显示数量动态加载
                        str = '';
                        $.each(data.list,function(name,value) {
                            str += '<li>';
                            str += '<a href="/zuhao/index/detail?id='+value.gameid+'">';
                            str += '<div class="list-img"><img src="'+value.gameimg+'"></div>';
                            str += '<p>'+value.title+'</p>';
                            str += '<div class="list-jg">';
                            str += '<del>原价：'+value.price_hour+'</del>';
                            str += '<span>现价：<em>'+value.active_price+'</em>元</span>';
                            str += '</div>';
                            str += '</a>';
                            str += '</li>';
                        });
                        $(".topic-list ul").append(str); //动态加载插入HTML
                    }
                }
            });
        }

html 隐藏域

<input id="#js-gameid" type="" name="{$gameid}">
    <input id="#js-pagesize" type="" name="{$pagesize}">
    <input id="#js-page" type="" name="{$pagenumber}">
    <input id="#js-sort" type="" name="{$sort}">