ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

pagination分页插件使用demo

2022-05-15 10:31:07  阅读:154  来源: 互联网

标签:插件 pageSize pageNo pageObj demo pagination 条数 true


<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    String basePath = request.getScheme() + "://" +
            request.getServerName() + ":" + request.getServerPort() +
            request.getContextPath() + "/";
%>
<html>
<head>

    <base href="<%=basePath%>"/>
    <title>pagination插件使用</title>
    <!--  It is a good idea to bundle all CSS in one file. The same with JS -->

    <!--  JQUERY -->
    <script type="text/javascript" src="jquery/jquery-1.11.1-min.js"></script>

    <!--  BOOTSTRAP -->
    <link rel="stylesheet" type="text/css" href="jquery/bootstrap_3.3.0/css/bootstrap.min.css">
    <script type="text/javascript" src="jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script>

    <!--  PAGINATION plugin -->
    <link rel="stylesheet" type="text/css" href="jquery/bs_pagination-master/css/jquery.bs_pagination.min.css">
    <script type="text/javascript" src="jquery/bs_pagination-master/js/jquery.bs_pagination.min.js"></script>
    <script type="text/javascript" src="jquery/bs_pagination-master/localization/en.js"></script>
    <script type="text/javascript">
        $(function() {
            $("#demo_pag1").bs_pagination({

                currentPage:1,//当前页号,相当于pageNo

                totalPages: 100,   // 总页数, 必填参数(计算得)
                totalRows:1000,    // 总条数
                rowsPerPage:100,   // 每页显示条数

                visibility:5,         //可以显示的显示的页面条数 1,2,3,4,5,6

                showGoToPage: true,   // 设置是否显示"跳转到"部分,默认true
                showRowsPerPage: true, // 设置是否显示每页显示条数的信息 默认true
                showRowsInfo: true,    // 是否显示记录的条数

                // 当用户每次切换页号都会自动触发本操作
                // 每次返回换页之后的pageNo 和 pageSize ,由此可以通过这两个参数查询数据库
                // limit (pageNo -1)*pageSize pageSize
                onChangePage:function (event,pageObj) {
                    alert(pageObj.currentPage)
                    alert(pageObj.rowsPerPage)
                }
            });

        });
    </script>
</head>
<body>
<!--  Just create a div and give it an ID -->

<div id="demo_pag1"></div>
</body>
</html>

标签:插件,pageSize,pageNo,pageObj,demo,pagination,条数,true
来源: https://www.cnblogs.com/yfs1024/p/16272528.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有