关于借助prototype进行分页的一个小插件

(function (win, undefined) {
  var pagefen = win.pagefen = function (inforAllcount) {
  this.nowpage = 1; //当前页
  this.pagecount = 10; //一次性加载十条
  //总共有多少页
  this.pageAllcount = (inforAllcount % this.pagecount == 0 ? (inforAllcount / this.pagecount) : (parseInt(inforAllcount / this.pagecount) + 1));

};
//上一页的方法 (当前页,每页显示的条数)
pagefen.prototype.uppage = function (nowpage, pagecount) {
  this.nowpage -= 1;
  this.nowpage = (this.nowpage == 0 ? 1 : this.nowpage)
  pagecontrol.seach(this.nowpage, this.pagecount);
}
//下一页的方法
pagefen.prototype.nextpage = function (nowpage, pagecount) {
  this.nowpage += 1;
  this.nowpage = (this.nowpage == (this.pageAllcount + 1) ? this.pageAllcount : this.nowpage);
  pagecontrol.seach(this.nowpage, this.pagecount);
  }
} (window));

//查询方法
var pagecontrol = {
  seach: function (nowpage, pagecount) {
  var pagefirst = (nowpage - 1) * pagecount + 1; //1条数据
  var pageend = nowpage * pagecount; //10条数据
  $('.addlistul li').hide();
  $('.addlistul li').slice(pagefirst - 1, pageend).show();
  }
};

 

$(function(){

  //此处是获取数据 添加进去ul里面的地方
  var ele = $('.addlistul');
  for (var i = 0; i < 100; i++) {
    ele.append("<li>" + (i + 1) + "</li>");
  }

  //实例化分页
  var pageMethod = new pagefen(100);
    pagecontrol.seach(1, 10);
  //上一页修改当前页加一
  $('.have_small').click(function () {
    pageMethod.uppage(this.nowpage, this.pagecount);
  });
  //下一页修改当前页减一
  $('.next_page').click(function () {
    pageMethod.nextpage(this.nowpage, this.pagecount);
  });

  //点击数字显示第几页的时候
  $('.num').click(function () {
    var getnumpage = parseInt($(this).text());

    //当前选中的页数然后调用查询方法

    pagecontrol.seach(getnumpage, 10);
    pageMethod.nowpage = getnumpage;
  });

});

 

<div class="r-h-3">
  <ul class="addlistul"></ul>
</div>

posted @ 2016-11-12 15:20  福小松  阅读(160)  评论(0编辑  收藏  举报