js分页--存储数据并进行分页

  //分页方法
           var page = function(){
               this.v = {
                   o:null,//ul父级层
                   home:null,
                   previous:null,
                   next:null,
                   last:null,   
                   list:[],
                   pageSize:10,
                   pageIndex:0,
                   pageCount:0,
                   rowCount:0
              };
              this.init = function(){
                 var _this = this;
                 _this.v.o.find("li").each(function(i,o){
                    _this.v.list.push($(o).html());
                 });
                 
                 _this.v.rowCount = _this.v.list.length;
                 _this.v.pageCount =  parseInt((_this.v.rowCount + _this.v.pageSize - 1)/_this.v.pageSize);
                 _this.process(0);
                 
                 _this.addcolor([_this.v.home,_this.v.previous]);
                 
                 //首页
                 _this.v.home.click(function(){
                     _this.v.pageIndex = 0;
                     _this.process(_this.v.pageIndex);
                     _this.addcolor([_this.v.home,_this.v.previous]);
                     _this.removecolor([_this.v.next,_this.v.last]);
                        
                 });
                 //上一页
                 _this.v.previous.click(function(){
                     if(_this.v.pageIndex > 0){
                       _this.process(--_this.v.pageIndex);
                       
                       if(_this.v.pageIndex == 0)
                           _this.addcolor([_this.v.home,_this.v.previous]);
                           
                       _this.removecolor([_this.v.next,_this.v.last]);   
                     }
                 });
                 //下一页
                 _this.v.next.click(function(){
                    if(_this.v.pageIndex < _this.v.pageCount-1){
                      _this.process(++_this.v.pageIndex);
                      
                      if(_this.v.pageIndex == _this.v.pageCount-1)
                           _this.addcolor([_this.v.next,_this.v.last]);
                           
                        _this.removecolor([_this.v.home,_this.v.previous]);   
                    }
                 });
                 //尾页
                 _this.v.last.click(function(){
                     _this.v.pageIndex = _this.v.pageCount-1;
                     _this.process(_this.v.pageIndex);
                     
                     _this.addcolor([_this.v.next,_this.v.last]);
                     _this.removecolor([_this.v.home,_this.v.previous]);
                 });
               };
               this.process = function(n){
                  var _this = this;
                  _this.v.o.find("ul").empty(); 
                  for(var i=(n*_this.v.pageSize);i<_this.v.rowCount;i++){
                    if(i > 0 && i % (_this.v.pageSize*(n+1)) == 0){
                        break;
                    }   
                    _this.v.o.find("ul").append("<li>"+_this.v.list[i]+"</li>");
                 }
               }
               this.addcolor = function(ac){
                 for(var j=0;j<ac.length;j++)
                    ac[j].addClass("page_disabled");
               }
               this.removecolor = function(rc){
                 for(var j=0;j<rc.length;j++)
                    rc[j].removeClass("page_disabled");   
               }
           };    
               
           (function(){
                //初始化按钮
                var p1 = new page();
                p1.v.o = $("#marquees1");
                p1.v.home = $("#zb1");
                p1.v.previous = $("#zb2");
                p1.v.next = $("#zb3");
                p1.v.last = $("#zb4");
                p1.init();
                }
)

 

转载于:https://www.cnblogs.com/elves/p/3612855.html