关于借助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>

转载于:https://www.cnblogs.com/Hsong/p/6056777.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值