文档章节

JS分页

宇哥v587
 宇哥v587
发布于 2017/08/25 17:08
字数 407
阅读 8
收藏 0

(function($) {

    var pageUtil = function() {

        var sum_pages = 0;

        return {

            /**
             * 验证分页跳转页数,正整数
             * @param 跳转页数
             * @returns true/false
             */
            validatePages : function(param) {
                if (param != "" && param!= null) {
                    var reg = /^[1-9]\d*$/;
                    return reg.test(param);
                } else {
                    return false;
                }
            },
            /**
             * 验证分页跳转页数
             * @param go_pages    跳转页数
             * @returns
             */
            validateSum : function (go_pages) {
                return parseInt($('#total_pages').text()) >= go_pages;
            },
            /**
             * 计算分页,改变页码的样式
             */
            createpagesIndex : function(sum, pages, count) {

                /** 计算分几页 */
                if (sum % count == 0) {
                    sum_pages = sum / count;
                } else {
                    sum_pages = sum / count + 1;
                }
                sum_pages = Math.floor(sum_pages);

                /** 显示总页数,当前页数 */
                $('#now_pages').text(pages);
                if (sum_pages == 0) {
                    $('#total_pages').text(1);
                } else {
                    $('#total_pages').text(sum_pages);
                }

                /* 当数据只有一页时,全部禁用 */
                if (sum_pages > 1) {
                    /* 禁用首页和上一页 */
                    if (pages == 1) {
                        $("#first_pages").attr({
                            style : "color: gray;"
                        });
                        document.getElementById("first_pages").disabled = true;
                        $("#before_pages").attr({
                            style : "color: gray;"
                        });
                        document.getElementById("before_pages").disabled = true;
                    } else {
                        $("#first_pages").attr({
                            style : "color: #428bca;"
                        });
                        document.getElementById("first_pages").disabled = false;
                        $("#before_pages").attr({
                            style : "color: #428bca;"
                        });
                        document.getElementById("before_pages").disabled = false;
                    }

                    /* 禁用尾页和下一页 */
                    if (pages == sum_pages) {
                        $("#next_pages").attr({
                            style : "color: gray;"
                        });
                        document.getElementById("next_pages").disabled = true;
                        $("#last_pages").attr({
                            style : "color: gray;"
                        });
                        document.getElementById("last_pages").disabled = true;
                    } else {
                        $("#next_pages").attr({
                            style : "color: #428bca;"
                        });
                        document.getElementById("next_pages").disabled = false;
                        $("#last_pages").attr({
                            style : "color: #428bca;"
                        });
                        document.getElementById("last_pages").disabled = false;
                    }
                } else {
                    $("#first_pages").attr({
                        style : "color: gray;"
                    });
                    document.getElementById("first_pages").disabled = true;
                    $("#before_pages").attr({
                        style : "color: gray;"
                    });
                    document.getElementById("before_pages").disabled = true;
                    $("#next_pages").attr({
                        style : "color: gray;"
                    });
                    document.getElementById("next_pages").disabled = true;
                    $("#last_pages").attr({
                        style : "color: gray;"
                    });
                    document.getElementById("last_pages").disabled = true;
                }

            },

            /**
             * 跳至首页
             */
            gotoFirstPages : function(pages,event) {
                if (pages != 1) {
                    pages = 1;
                    event(pages);
                }

            },
            /**
             * 跳至上一页
             */
            gotoPrvePages : function(pages,event) {
                if (pages > 1) {
                    pages--;
                    event(pages);
                }

            },
            /**
             * 跳至下一页
             */
            gotoNextPages : function(pages,event) {
                if (pages < sum_pages) {
                    pages++;
                    event(pages);
                }
            },
            /**
             * 跳至尾页
             */
            gotoEndPages : function(pages,event) {
                if (pages != sum_pages) {
                    pages = sum_pages;
                    event(pages);
                }
            },
        }

    }();
    window.pageUtil = pageUtil;
})(jQuery);

 

<!--分页器-->
                        <div class="pagination_box">
                            <ul class="paginations">
                                <li id="first_pages">首页</li>
                                <li id="before_pages">上一页</li>
                                <li><span id="now_pages">0</span>/<span id="total_pages">0</span></li>
                                <li id="next_pages">下一页</li>
                                <li id="last_pages">尾页</li>
                            </ul>
                            <div>
                                <input type="text" id="index_pages" placeholder="输入页码"/><span id="changepages">跳转</span>
                            </div>
                        </div>

© 著作权归作者所有

上一篇: JS 工作日常整理
下一篇: SQL新增语法练习
宇哥v587
粉丝 1
博文 47
码字总数 20855
作品 0
南京
程序员
私信 提问
13 个最佳 JavaScript 数据表格库

JavaScript 是一种通常被用在网页开发中的编程语言。它主要是在互联网上的网页浏览器中开发出效果出众且可交互的特效。它是客户端脚本语言中的一种,是被用来作为通过用户的网页浏览器进行处...

oschina
2017/03/10
7K
7
基于 jQuery 的 JavaScript 分页组件 - Pagination

Pagination 是一个基于 jQuery 实现的一个简单的 JavaScript 分页组件,主要实现以下功能: 1. 方便在 JavaScript 中对后端分页数据进行展示 2. 自动生成分页组件,包括首页、页码、末页、页...

勤劳的小木匠
2018/07/19
6.5K
0
SlidesJS基本使用方法_已整理

来源 MZB大豆博客 Slides – 是一个简单的,容易定制和风格化,的jQuery幻灯片插件。 Slides提供褪色或幻灯片过渡效果,图像淡入淡出,图像预压,自动生成分页,循环,自动播放的自定义等很多...

辣条拌鱼翅
2015/01/01
60
0
easyui-table表格客户端分页实例

版权声明:本文为博主原创文章,如需转载,请标明出处。 https://blog.csdn.net/alan_liuyue/article/details/76783083 一、前言 前一篇博客已经介绍了bootstrap-table的客户端分页,而本...

尘光掠影
2017/08/06
0
0
bboss分页组件翻页js前置处理函数和js后置处理函数使用方法

bboss 3.7.7版本及后续版本为分页组件增加翻页js前置处理函数和翻页js后置处理函数,本文介绍使用方法。 1.说明: 为了实现这个功能,对/include下面的pager.js文件做了重构,将所有的分页处...

bboss
2014/01/16
0
0

没有更多内容

加载失败,请刷新页面

加载更多

64.监控平台介绍 安装zabbix 忘记admin密码

19.1 Linux监控平台介绍 19.2 zabbix监控介绍 19.3/19.4/19.6 安装zabbix 19.5 忘记Admin密码如何做 19.1 Linux监控平台介绍: 常见开源监控软件 ~1.cacti、nagios、zabbix、smokeping、ope...

oschina130111
今天
10
0
当餐饮遇上大数据,嗯真香!

之前去开了一场会,主题是「餐饮领袖新零售峰会」。认真听完了餐饮前辈和新秀们的分享,觉得获益匪浅,把脑子里的核心纪要整理了一下,今天和大家做一个简单的分享,欢迎感兴趣的小伙伴一起交...

数澜科技
今天
7
0
DNS-over-HTTPS 的下一代是 DNS ON BLOCKCHAIN

本文作者:PETER LAI ,是 Diode 的区块链工程师。在进入软件开发领域之前,他主要是在做工商管理相关工作。Peter Lai 也是一位活跃的开源贡献者。目前,他正在与 Diode 团队一起开发基于区块...

红薯
今天
6
0
CC攻击带来的危害我们该如何防御?

随着网络的发展带给我们很多的便利,但是同时也带给我们一些网站安全问题,网络攻击就是常见的网站安全问题。其中作为站长最常见的就是CC攻击,CC攻击是网络攻击方式的一种,是一种比较常见的...

云漫网络Ruan
今天
11
0
实验分析性专业硕士提纲撰写要点

为什么您需要研究论文的提纲? 首先当您进行研究时,您需要聚集许多信息和想法,研究论文提纲可以较好地组织你的想法, 了解您研究资料的流畅度和程度。确保你写作时不会错过任何重要资料以此...

论文辅导员
今天
8
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部