zoukankan      html  css  js  c++  java
  • easyUI之Pagination(分页)

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
        <title>Pagination(分页)</title>
        <meta http-equiv="keywords" content="学习,IT学习,好好学习">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
      
          <!-- 引入css文件,不限顺序 -->
        <link rel="stylesheet" href="../themes/default/easyui.css" type="text/css"></link>
        <link rel="stylesheet" href="../themes/icon.css" type="text/css"></link>
      
          <!-- 引入js文件,有顺序限制 -->
        <script type="text/javascript" src="../js/jquery.min.js"></script>
        <script type="text/javascript" src="../js/jquery.easyui.min.js"></script>
        <script type="text/javascript" src="../js/easyui-lang-zh_CN.js"></script>
    
        <!-- 所有的css文件和的有的js文件位置不限 -->
        
      </head>
      
      
      <body>
        
        
        <!-- 静态方式创建pagination 
        <div 
            id="paginationID" 
            class="easyui-pagination" 
            data-options="total:2000,pageSize:10" 
            style="background:#efefef;border:1px solid #ccc;"></div> 
        -->
        
        <div 
            id="paginationID" 
            style="background:#efefef;border:1px solid #ccc;800px">
        </div> 
        
        <script type="text/javascript">
            //total表示总记录数
            //pageSize表示每页显示多少条记录
            //pageNumber表示当前页号
            //pageList表示可供选择的每页显示多少条记录,pageSize变量的值必须属性pageList集合中的值之一
            $("#paginationID").pagination({
                "total" : 100,
                "pageSize" : 10,
                "pageNumber" : 1,
                "pageList" : [10,20],
                "layout" : ['list','sep','first','prev','manual','next','last','links']
            });
        </script>
        
        <script type="text/javascript">
            $("#paginationID").pagination({
                "onSelectPage" : function(pageNumber,b){
                    alert("pageNumber=" + pageNumber);
                    alert("pageSize=" + b);
                }
            });
        </script>
        
      </body>
    </html>
  • 相关阅读:
    什么是Code Review
    支撑5亿用户、1.5亿活跃用户的Twitter最新架构详解及相关实现
    shell的数组操作
    CDN(内容分发网络)技术原理
    云计算服务模型,第 3 部分: 软件即服务(PaaS)
    Mongodb
    360的开源项目
    用linux mail命令发送邮件[Linux]
    BZOJ2761:[JLOI2011]不重复数字(map)
    BZOJ1821:[JSOI2010]部落划分(并查集,二分)
  • 原文地址:https://www.cnblogs.com/loaderman/p/10062390.html
Copyright © 2011-2022 走看看