tp6 ajax 无刷新分页 js自定义方法

在开发过程中总是遇到分页问题 刷新分页体验不好   

写了一个公共方法配置分页生成的属性 (可以适当自定义修改)

注:需要引用jquery

主动触发 分页方法

myAjax(1)
function myAjax(page = 1, limit = 5 )
{
    $.post('/index/list',
        {
            'page':page,
            'limit':limit
        },function(data, status){
            if (status != 'success')
            {
                alert('请求失败!');
                return false;
            }
            if(data.code == 0)
            {
                return false;
            }
            var str = ''
            $(data.data).each(function(index, value){
                str += '<li>'
                    str += '............你要替换的代码'
                str += '</li>'
            })
            // 要替换的元素
            $('.content ul').html(str)
            if (page != 0)
            {
                // 追加分页数据
                $('.page').html(data.pageData)
                // 主要的触发公共方法
                ajaxPage('.page', 'userMyCourse(%s, 5)')
            }
        }
        )
}

公共方法 注:确保页面加载完毕后触发


// ajax分页时 处理分页数据 
// @param tag 分页数据所在的标签
// @param func 方法名参数 %s 为页码 5为分页条数
// ajaxPage('.saspages .clearfloat', 'userMyCourse(%s, 5)')
function ajaxPage(tag = '', func = '')
{
    var pageData = $(tag).children()
    $(pageData).each(function(index, value){
        // 获取标签类名
        var className = $(value).attr('class')
        // 处理选中与未选中状态
        if (className != 'disabled' && className != 'active')
        {
            var _url = $(value).children('a').attr('href');
            var _id = getUrlParam(_url, 'page');
            // $(value).children('a').attr('href', 'javascript:void(0)');
            $(value).children('a').attr({
                'value': _id,
                'href': 'javascript:void(0)',
                'onclick':func.replace('%s', _id)
            })
        }
    })
}

少量改动后就可以使用了

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值