zoukankan      html  css  js  c++  java
  • 推荐一款分页插件

    插件展示效果

      

    使用方法

    引入插件CSS、js。

    <link rel="stylesheet" type="text/css" href="pagination.css" />
    <script src="jquery.paging.js" type="text/javascript" charset="utf-8"></script>

    在项目中添加一个方法

    function getDPage(totalPage,currPage){
        $('.pagination').pagination({
            pageCount:totalPage,
            coping:true,
            current:currPage,
            prevContent:'上一页',
            nextContent:'下一页',
            callback:function(api){
                getData(api.getCurrent());
                $('body,html').scrollTop(0);
            }
        });
    }

    最后是分页的使用

    该处为传给之前写的方法中的参数:totalPage为后台传给的页码的总数,page为当前选中的页码数。
    function getData(page) {
    $(".pagination").addClass("hidden");//分页先隐藏
    var data=({})//传递给后台的参数,page为选中的页码, $.ajax({ type:
    "post", url: '', data: { "data": JSON.stringify(data) }, dataType: "json", success: function(data) { $(".pagination").removeClass("hidden");//展示分页 if(page == 1) { $(".pagination").empty();//单页面有多个分页的情况先需要先清除页面分页代码。 if($(".pagination").html().trim() == "") { getDPage(totalPage, page);//该处为传递给之前定义的方法中的参数:totalPage为后台传递的页码的总数,page为当前选中的页码数。 } } }, beforeSend: function(t) {}, error: function(t) { var a = JSON.stringify(t) } }); }

     为何需要先隐藏分页,原因是项目一般都会要求只有一页是不需要展示分页效果。

    获取列表一信息时必须使用getData(page)方法,分页才能正常使用。

    样式CSS、js我已整理好:http://pan.baidu.com/s/1bpGT68Z

  • 相关阅读:
    图片轮播
    swoole 内存泄露的问题有没有好的办法解决
    学习Swoole需要掌握哪些基础知识
    通过SSH通道来访问MySQL
    redis常见应用场景
    Redis 消息队列的实现
    PHP-Curl模拟HTTPS请求
    代码重构方向原则指导
    win8.1系统相关
    SQL Server 学习系列之六
  • 原文地址:https://www.cnblogs.com/luoshang/p/7345951.html
Copyright © 2011-2022 走看看