https://www.jxycu.edu.cn/_upload/tpl/03/ba/954/template954/page/page.js

1;(function ($, window, document, undefined) {
2    'use strict';
3    function Paging(element, options) {
4        this.element = element;
5        this.options = {
6            pageNum: options.pageNum || 1, // 当前页码
7            totalNum: options.totalNum, // 总页码
8            totalList: options.totalList, // 数据总记录
9            preCount: options.preCount,
10            callback: options.callback // 回调函数\
11        };
12        this.init();
13    }
14    Paging.prototype = {
15        constructor: Paging,
16        init: function () {
17            this.createHtml();
18            this.bindEvent();
19        },
20        createHtml: function () {
21            var me = this;
22            var content = [];
23            var pageNum = me.options.pageNum;
24            var totalNum = me.options.totalNum;
25            var totalList = me.options.totalList;
26            var preCount = me.options.preCount;
27            content.push("<span>每页</span><span class='white' id='per_count'>"+preCount+"</span><span>条</span><button type='button' id='prePage'>上页</button>");
28            // 总页数大于6必显示省略号
29            if (totalNum > 6) {
30                // 1、当前页码小于5且总页码大于6 省略号显示后面+总页码
31                if (pageNum < 5) {
32                    // 1与6主要看要显示多少个按钮 目前都显示5个
33                    for (var i = 1; i < 6; i++) {
34                        if (pageNum !== i) {
35                            content.push("<button type='button'>" + i + "</button>");
36                        } else {
37                            content.push("<button type='button' class='current'>" + i + "</button>");
38                        }
39                    }
40                    content.push(". . .");
41                    content.push("<button type='button'>" + totalNum + "</button>");
42                } else {
43                    // 2、当前页码接近后面 到最后页码隔3个 省略号显示后面+总页面
44                    if (pageNum < totalNum - 3) {
45                        for (var i = pageNum - 2; i < pageNum + 3; i++) {
46                            if (pageNum !== i) {
47                                content.push("<button type='button'>" + i + "</button>");
48                            } else {
49                                content.push("<button type='button' class='current'>" + i + "</button>");
50                            }
51                        }
52                        content.push(". . .");
53                        content.push("<button type='button'>" + totalNum + "</button>");
54                    } else {
55                        // 3、页码至少在5，最多在【totalNum - 3】的中间位置 第一页+省略号显示前面
56                        content.push("<button type='button'>" + 1 + "</button>");
57                        content.push(". . .");
58                        for (var i = totalNum - 4; i < totalNum + 1; i++) {
59                            if (pageNum !== i) {
60                                content.push("<button type='button'>" + i + "</button>");
61                            } else {
62                                content.push("<button type='button' class='current'>" + i + "</button>");
63                            }
64                        }
65                    }
66                }
67            } else {
68                // 总页数小于6
69                for (var i = 1; i < totalNum + 1; i++) {
70                    if (pageNum !== i) {
71                        content.push("<button type='button'>" + i + "</button>");
72                    } else {
73                        content.push("<button type='button' class='current'>" + i + "</button>");
74                    }
75                }
76            }
77            content.push("<button type='button' id='nextPage'>下页</button>");
78            content.push("<span>第</span><input value='1' class='white' id='count'><span>/"+totalNum+"</span><button type='button' id='jump'>跳转</button>");
79            me.element.html(content.join(''));

80
81            // DOM重新生成后每次调用是否禁用button
82            setTimeout(function () {
83                me.dis();
84            }, 20);
85        },
86        bindEvent: function () {
87            var me = this;
88            me.element.off('click', 'button');
89            // 委托新生成的dom监听事件
90            me.element.on('click', 'button', function () {
91                var id = $(this).attr('id');
92                var num = parseInt($(this).html());
93                var pageNum = me.options.pageNum;
94                if (id === 'prePage') {
95                    if (pageNum !== 1) {
96                        me.options.pageNum -= 1;
97                    }
98                } else if (id === 'nextPage') {
99                    if (pageNum !== me.options.totalNum) {
100                        me.options.pageNum += 1;
101                    }
102                } else if (id === 'firstPage') {
103                    if (pageNum !== 1) {
104                        me.options.pageNum = 1;
105                    }
106                } else if (id === 'lastPage') {
107                    if (pageNum !== me.options.totalNum) {
108                        me.options.pageNum = me.options.totalNum;
109                    }
110                }else if (id === 'jump') {
111                      pageNum=parseInt($("#count").val());
112                    if (pageNum>=1&&pageNum<=me.options.totalNum) {
113                        me.options.pageNum =pageNum
114                    }else{
115                        alert("请输入正确页面")
116                        return;
117                    }
118                } else {
119                    me.options.pageNum = num;
120                }
121                me.createHtml();
122                if (me.options.callback) {
123                    me.options.callback(me.options.pageNum);
124                }
125            });
126        },
127        dis: function () {
128            var me = this;
129            var pageNum = me.options.pageNum;
130            var totalNum = me.options.totalNum;
131            if (pageNum === 1) {
132                me.element.children('#firstPage, #prePage').prop('disabled', true);
133            } 
134	if (pageNum === totalNum) {
135                me.element.children('#lastPage, #nextPage').prop('disabled', true);
136            }
137        }
138    };
139    $.fn.paging = function (options) {
140        return new Paging($(this), options);
141    }
142})(jQuery, window, document);