【前端js分页】多页...代替 详细简单

效果图：

renderPage:function(){
   var self = this;
   var opt = self.options
   var lis = '';
   var total = opt.pageTotal
   var hid = !1
   // 上一页
   opt.currentPage > 1 && (lis += '<li><a href="javascript:void(0)" data="'+(opt.currentPage-1)+'" aria-label="Previous">&laquo;</a></li>')
   for (var i = 1;i <= total; i++){
       // 如果为第一页/最后一页/当前页-左右
       // 小于5页显示全部||显示最前最后页||显示当前页的上一页下一页
       if ((total <= 5) || (i == 1 || i == total) || (i <= opt.currentPage + 1) && (i >= opt.currentPage - 1)) {
           lis += '<li class="'+(opt.currentPage == i ? 'active':'')+'"><a href="javascript:void(0)" data="'+i+'">'+i+'</a></li>'
           hid = !0 // 显示...
       } else if (hid){
           lis += '<li><span>...</span></li>'
           hid = !1
       }
   }
   // 下一页
   opt.currentPage < total && (lis += '<li><a href="javascript:void(0)" data="'+(opt.currentPage+1)+'" aria-label="Previous">&raquo;</a></li>')
   return lis
}

---

QQ 群：1039376081

主站点：https://laherz.com