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

news/2024/7/19 15:47:30 标签: ajax, js, php

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

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

注:需要引用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)
            })
        }
    })
}

少量改动后就可以使用了


http://www.niftyadmin.cn/n/1046881.html

相关文章

【炼数成金 RapidMiner 二 】数据导入、预处理、导出

&#xff08;1&#xff09;链接数据库 &#xff08;2&#xff09;选择相关数据 &#xff08;3&#xff09;导入数据显示 &#xff08;4&#xff09;第二种方案 直接打开一个csv文件 &#xff08;5&#xff09; 设定存储位置 得到插入csv文件的数据表 &#xff08;6&#xff09;…

https请求百度share分享报错问题

网站更新为https后 分享时出了点问题(用的百度share) 解决方法有三种 1. 网站改为http的(这是废话) 2. 使用其他分享方法 3. 把百度share的静态资源下载下来 推荐使用3方法 资源包地址 https://download.csdn.net/download/qq_36999656/13963215 备用地址 链接&#x…

xshell7官方下载链接

xshell为了拉取用户 下载过程也变的繁琐起来 需要输入邮箱然后把链接发送到邮箱才能下载 下载把链接贴出来 https://download.netsarang.com/23600529/Xshell-7.0.0054.exe 上面是官网地址

vscode 设置中文语言包

安装好vscode之后 想更改为中文语言包 ctrlshiftx 调出扩展选择项 搜索 Chinese 找到中文(简体/繁体) 然后点击install就ok了 设置完成之后重启一下编辑器就行了

easyadmin 安装时 implode(): Passing glue string after array is deprecated. Swap the parameters

implode(): Passing glue string after array is deprecated. Swap the parameters 安装一个框架时遇到这个错误了 框架官方是这么写的 应该是两个参数位置写反了 php文档是这么写的 把参数的两个位置换一下就行了

asp.net中,表单提交后,防刷新重复提交、防后退解决办法

为避免操作重复提交&#xff0c;操作后刷新的确是个常见的问题&#xff0c;查了查资料后&#xff0c;发现&#xff0c;解决这个问题原来有个很简单的办法。 asp.net中&#xff0c;表单提交一般在一个事件中&#xff0c;提交后一般会友好的提示一些成功信息&#xff0c;然后重定…

layUI地区三级联动

省市数据 为像下面这样的 省市 ->该省市下的区县->该区县下的乡镇 这种json格式 key名可以自己定义 把用到的地方都改一下就行 [{"id": "36","pid": "0","name": "国内","children": [{"…

C#开发框架-钢铁贸易进销存系统演示视频

CS开发框架-钢铁贸易进销存系统演示视频本视频演示钢铁贸易行业进销存系统 框架版本&#xff1a;开发框架2.0版WebService架构 开发语言: C#.Net 操作系统: XP 数据库 : SQL 2005 Free downloadjxc_cs2_webservice.rar (28075KB) 点击这里下载CS开发框架-钢铁贸易进销存…