评论:jQuery仿淘宝分页插件(原创)  [查看原文]

所属分类:导航-分页

 35947  352  44
当前第1页 / 共2页
    (づ ●─● )づ0
    2020/2/29 19:42:28
    怎么实现动态的修改数目总数 total_item: '自然数,必填', //条目总数
        上上谦0
        2020/3/8 15:39:18
        解决了吗
        无忧无虑1
        2020/3/13 10:43:59

        这个插件是一次性初始化的,一次性请求所有数据,然后前台分页显示,并非翻页一次请求一页数据.要实现动态请求的话,需要先清空容器再重新配置参数调用,比如:

        $(obj).html("").page_ctr({..})
    回复
    (づ ●─● )づ0
    2020/2/27 16:40:03
    问一下楼主为什么我把你的demo引入后这就像个页面在我的menu的上面
        无忧无虑0
        2020/3/13 10:38:04
        分页插件是自动加载在容器后面的,如果内容不够一页是不会显示出来,其他定制化样式,另外写css覆盖就行
    回复
    25h0
    2019/12/19 11:07:28
    var obj = {
      obj_box: '.class/#id...', //翻页容器(css选择器均可)
      total_item: '自然数,必填', //条目总数
      per_num: '自然数,选填,默认10', //每页条目数
      current_page: '自然数,选填,默认1', //当前页
      change_content: function(per_num, current_page) {
          //内容加载方法,可参考示例
      }
    };
    page_ctrl(obj); //调用分页插件

    请问楼主,如果数据返回的是总页数,而不是条目总数,该如何解?

        无忧无虑1
        2019/12/23 11:36:51
        如果返回的数据有总页数,应该是分步加载数据,每次请求当前页数据,而不是所有。不想花时间改源码的话,调用插件前可以先遍历数据计算下。须知道每页的显示条目数,固定不变的话,可以写死,有变动的话就需要后台返回给你。每页n条,条目总数就可以是n*总页数,即使最后一页不足n条,基本也不影响插件的准确性。当然了,最好是让后台返回总条目数给你。
        (づ ●─● )づ0
        2020/2/29 14:51:51
        大佬你的page_ctrl在哪加载的
        无忧无虑0
        2020/3/13 10:30:37
        整个toPage.js就是page_ctr方法
    回复
    Asher-GTR0
    2019/6/26 14:41:53
    可以用在移动端吗?
        无忧无虑0
        2019/6/28 8:54:09
        可以,如果不用jQuery,要用原生js改造
    回复
    9706038970
    2019/3/27 17:09:20
    else if (that.hasClass('to_page_num')) {
       var pageNum = parseInt(that.siblings('.input_page_num').val());
       if (pageNum >= 1 && pageNum <= total_page) {
           current_page = pageNum;
       } else {
           current_page = 1;
       }
       that.parent('.page_ctrl').html('');
       page_even();
    }
    回复
    AnotherWay_05360
    2019/2/27 11:07:14
    求ajax生成的思路,我现在写的会请求两次服务器。
        无忧无虑1
        2019/2/28 8:30:43
        是否找到两次请求的原因?像事件冒泡,页面刷新,重复调用......再有每次ajax调用前,你可能需要先清空分页容器的内容,如:$(obj).html('')
    回复
    亲爱的-Jun0
    2019/1/29 14:45:02
    待我签到几天,再来下载作者的作品~~ 回复
    明小月0
    2019/1/29 11:19:01
    能给个ajax的例子吗,新手,求大神赐教,QQ邮箱1121294435@qq.com,异步加载 我写了没有实现异步加载 ,页面永远都是第一页的内容
        无忧无虑1
        2019/2/12 10:51:06

        新年好!今天开工才看到评论,我提供一下思路:把ajax异步加载的方法写进

        change_content:function(per_num,current_page){
           Ajax请求...
        }

        这样只要页码改变,都会调用这个方法,从而发起请求.

    回复
    明小月0
    2019/1/28 17:08:49
    为什么我ajax请求回调成功后然后循环的都是第一页的页面数据
        无忧无虑1
        2019/2/12 10:58:09
        多尝试吧,要根据页码判断来展示数据,关键还是在change_content对象方法中编写业务逻辑
    回复
    守熊~人0
    2018/12/25 9:45:11
    可以的,配合ajax应该挺好用 回复
    nomad770
    2018/12/14 19:03:40
    如果不要“确定”按钮 输入框输完数字 失去焦点就跳转到对应数字的页码 该怎么实现呢
        无忧无虑0
        2018/12/18 18:41:06
        在page.js里去掉追加的确认按钮元素,再为input添加失焦事件,然后把点击事件封装成失焦方法
    回复
    nomad770
    2018/12/5 13:02:27

    楼主 请教个问题

    var obj = {
       obj_box: '.class/#id...', //翻页容器(css选择器均可)
       total_item: '自然数,必填', //条目总数
       per_num: '自然数,选填,默认10', //每页条目数
       current_page: '自然数,选填,默认1', //当前页
       change_content: function(per_num, current_page) {
           //内容加载方法,可参考示例
       }
    };
    page_ctrl(obj); //调用分页插件

    total_item 如何用动态的数字  分页的总数从数据库读取 而不是写一个死数字

        无忧无虑1
        2018/12/6 12:26:16

        把page_ctrl(obj)方法放在ajax请求回调中,如果是一次请求,从数据库获取条目总数然后赋值给total_item,再调用page_ctrl(obj)方法就可以了.
        多次请求,需要在回调里先清空分页容器的内容(方法很多),比如

        $(obj.obj_box).html('');

        而后再调用

        page_ctrl(obj);

        或者修改toPage.js,把append()换成html();

        ?╂ 淡不掉、0
        2019/7/16 15:56:45
        我要怎么绑定上一页下一页到其他的标签呢
        (づ ●─● )づ0
        2020/2/28 17:16:03
        想请问一下page_ctrl(obj);放在什么位置上,是封装html和json数据之后还是哪
    回复
    champion_yo0
    2018/11/21 13:06:42
    怎么能获取下载积分
        无忧无虑0
        2018/11/22 11:37:58
        注册登录后:
        1,保持每天签到,从第四天开始,每天获得一个jq币
        2,通过发布代码或插件
        3,评论别人的插件,解决提问者问题等
        4,有钱能使鬼推磨,花钱买.
    回复
    Ajax0
    2018/11/13 9:39:31
    有个问题 就是?total_item小于per_num的时候 就不行了
        无忧无虑0
        2018/11/14 8:41:45
        不是不行,是做了判断,不足两页不加载组件,total_item小于per_num就一页,为什么还要分?
        无忧无虑1
        2018/11/14 8:42:52
        你要想加载可以自己在page.js里去掉限制条件
        champion_yo0
        2018/11/21 13:04:26
        page 分页插件ok?
    回复
    fox1
    2018/10/26 9:53:28

    改进建议:
    1. 建议把 change_content() 单独提取出来使用,通用性较高

    // fn 为自定义函数的函数名
    // 在 fn 函数中可以使用 arguments[0] 获取当前页数(current_page)
    function page_ctrl(data_obj,fn) {
            ......
           function change_content() {
               eval(fn+"("+current_page+");");
           }
           ......
    }

    2. 关于自定义输入跳转页面非法数据问题(形如输入页码为:-1、大于总页数等数据)改进

    // 在最后一个 else if
    // 这是只是简单示范一下,更严格的数据校验还需根据需求完善
    else if (that.hasClass('to_page_num')) {
        var pageNum = parseInt(that.siblings('.input_page_num').val());
        if (current_page >= 1 && current_page <= total_page) {
            current_page = pageNum;
        } else {
            current_page = 1;
        }
        that.parent('.page_ctrl').html('');
        page_even();
    }
        fox1
        2018/10/26 9:56:59

        sorry,打错了;第二点代码

        else if (that.hasClass('to_page_num')) {
            var pageNum = parseInt(that.siblings('.input_page_num').val());
            if (pageNum >= 1 && pageNum <= total_page) {
                current_page = pageNum;
            } else {
                current_page = 1;
            }
            that.parent('.page_ctrl').html('');
            page_even();
        }
        无忧无虑0
        2018/10/29 16:13:32
        不好意思,回复晚了几天.
        首先,非常感谢您的反馈,看得出来您是研究过源码的.
        关于页码的范围限制,发布的插件中的确没有做处理,这个我会找个时间更新一版,已经下载使用的,可以自行优化一下,难度不大.
        关于插件中change_content()方法,它是加载数据的一种示例方法,即使完全删除,对插件本身都是没有影响的,实际使用时,是需要使用者根据具体项目各展神通的.事实上,该事件应该作为参数从外传入,而后调用,尤其是多处使用时.
        最后,再次表示感谢!
    回复

讨论这个项目(44)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

取消回复