init

public/web/static/map/map_car_dd/data/xlPaging.js

@@ -0,0 +1,145 @@
+;(function ($, window, document, undefined) {
+    'use strict';
+    function Paging(element, options) {
+        this.element = element;
+        this.options = {
+            nowPage: options.nowPage || 1, // 当前页码
+            pageNum: options.pageNum, // 总页码
+            buttonNum: (options.buttonNum>=5?options.buttonNum:5) || 7,// 页面显示页码数量
+            callback: options.callback // 回调函数
+        };
+        this.init();
+    }
+    Paging.prototype =  {
+        constructor : Paging,
+        init : function() {
+            this.createHtml();
+            this.bindClickEvent();
+            this.disabled();
+        },
+        createHtml : function(){
+            var me = this;
+            var nowPage = this.options.nowPage;
+            var pageNum = this.options.pageNum;
+            var buttonNum = this.options.buttonNum;
+            var content = [];
+            content.push("<ul>");
+            content.push("<li class='xl-prevPage'>上一页</li>");
+            //页面总数小于等于当前要展示页数总数，展示所有页面
+            if(pageNum <= buttonNum){
+                for(var i=1; i<=pageNum; i++){
+                    if (nowPage !== i) {
+                        content.push("<li>"+i+"</li>");
+                    } else {
+                        content.push("<li class='xl-active'>"+i+"</li>");
+                    }
+                }
+            }else if(nowPage <= Math.floor(buttonNum / 2)){
+                //当前页面小于等于展示页数总数的一半（向下取整），从1开始
+                for(var i=1;i<= buttonNum-2;i++){
+                    if (nowPage !== i) {
+                        content.push("<li>"+i+"</li>");
+                    } else {
+                        content.push("<li class='xl-active'>"+i+"</li>");
+                    }
+                }
+                content.push("<li class='xl-disabled'>...</li>");
+                content.push("<li>" + pageNum + "</li>");
+            }else  if(pageNum - nowPage <= Math.floor(buttonNum / 2)){
+                //当前页面大于展示页数总数的一半（向下取整）
+                content.push("<li>"+1+"</li>");
+                content.push("<li class='xl-disabled'>...</li>");
+                for(var i=pageNum-buttonNum+3; i<=pageNum; i++){
+                    if (nowPage !== i) {
+                        content.push("<li>"+i+"</li>");
+                    } else {
+                        content.push("<li class='xl-active'>"+i+"</li>");
+                    }
+                }
+            }else{
+                //前半部分页码
+                if(nowPage - Math.floor(buttonNum / 2) <= 0){
+                    for(var i=1;i<= Math.floor(buttonNum / 2);i++){
+                        if (nowPage !== i) {
+                            content.push("<li>"+i+"</li>");
+                        } else {
+                            content.push("<li class='xl-active'>"+i+"</li>");
+                        }
+                    }
+                }else{
+                    content.push("<li>"+1+"</li>");
+                    content.push("<li class='xl-disabled'>...</li>");
+                    for(var i=nowPage-Math.floor(buttonNum / 2)+(buttonNum % 2 == 0 ? 3: 2); i<=nowPage; i++){
+                        if (nowPage !== i) {
+                            content.push("<li>"+i+"</li>");
+                        } else {
+                            content.push("<li class='xl-active'>"+i+"</li>");
+                        }
+                    }
+
+                }
+                //后半部分页码
+                if(pageNum - nowPage <= 0){
+                    for(var i=nowPage+1;i<=pageNum;i++){
+                        content.push("<li>" + i + "</li>");
+                    }
+                }else{
+                    for(var i=nowPage+1; i<=nowPage+Math.floor(buttonNum / 2)-2; i++){
+                        content.push("<li>"+i+"</li>");
+                    }
+                    content.push("<li class='xl-disabled'>...</li>");
+                    content.push("<li>" + pageNum + "</li>");
+                }
+            }
+            content.push("<li class='xl-nextPage'>下一页</li>");
+            content.push("</ul>");
+            me.element.html(content.join(''));
+             // DOM重新生成后每次调用是否禁用button
+            setTimeout(function () {
+                me.disabled();
+            }, 20);
+            
+        },
+        bindClickEvent: function(){
+            var me = this;
+            me.element.off('click', 'li');
+            me.element.on('click', 'li', function () {
+                var cla = $(this).attr('class');
+                var num = parseInt($(this).html());
+                var nowPage = me.options.nowPage;
+                if( $(this).hasClass('xl-disabled')){
+                    return ;
+                }
+                if (cla === 'xl-prevPage') {
+                    if (nowPage !== 1) {
+                        me.options.nowPage -= 1;
+                    }
+                } else if (cla === 'xl-nextPage') {
+                    if (nowPage !== me.options.pageNum) {
+                        me.options.nowPage += 1;
+                    }
+                }else {
+                    me.options.nowPage = num;
+                }
+                me.createHtml();
+                if (me.options.callback) {
+                    me.options.callback(me.options.nowPage);
+                }
+            });
+
+        },
+        disabled: function () {
+            var me = this;
+            var nowPage = me.options.nowPage;
+            var pageNum = me.options.pageNum;
+            if (nowPage === 1) {
+                me.element.children().children('.xl-prevPage').addClass('xl-disabled');
+            } else if (nowPage === pageNum) {
+                me.element.children().children('.xl-nextPage').addClass('xl-disabled');
+            }
+        }
+    }
+    $.fn.paging = function (options) {
+        return new Paging($(this), options);
+    }
+})(jQuery, window, document);