分页导航 简洁版 只有上一页下一页

之前发布过一个比较功能复杂的分页导航

不截图了 直接粘贴 不用太感谢 点赞就行

function pager(args) {
var el = args.el;
var total = args.total;
var index = args.index;
var callback = args.selected || function () {};
//渲染组件
(function render(index) {
var nodeList = '';//以当前页码为中心,前后各取两位作为开始和结束位置
var start = index - 1;
var end = index + 1;//上一页页码(如果当前页码为1,则禁用上一页按钮)
nodeList += '<a href="javascript:;" class="prev' + ((index !== 1) ? '' : ' disabled') + '">上一页</a>';
//中间页页码
if(index >=1 && index <= total){
nodeList += '<a href="#" class="page active">'+index+'</a>';
}
//下一页页码 (如果当前页码为总页数,则禁用下一页按钮)
nodeList += '<a href="javascript:;" class="next' + ((index !== total) ? '' : ' disabled') + '">下一页</a>';
el.innerHTML = nodeList;
[].forEach.call(document.querySelectorAll('.paging a:not(.disabled):not(.active)'), function (item, idx) {
item.addEventListener('click', function (e) {
e.preventDefault();
if (item.classList.contains('prev')) {
index--;
} else if (item.classList.contains('next')) {
index++;
} else {
index = Number(item.innerText);
}
render(index);
callback(index);
}, false);
});
nodeList = '';
})(index);
}
 
额  复制的有点恶心  自己弄一个js文件放进去 直接引用
方法   <div class=" paging "></div>
具体js还有操作  跟原来哪一个一摸一样  具体怎么弄 找一下另一篇文章吧
算了还是给你们粘出来吧
http://www.cnblogs.com/WoAiZmm/p/7768117.html
如若转载请著名出处 谢谢!
原文地址:https://www.cnblogs.com/WoAiZmm/p/7992877.html