分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 软件开发

JS分页方法

发布时间:2023-09-06 01:27责任编辑:胡小海关键词:暂无标签

index:当前页码;totalNum:接口返回的记录总条数;

 1 function paging(index,totalNum) 2 { 3 ????pageTotal = Math.ceil(totalNum / pagesize);//总的页数 4 ????var htmlShow = ‘‘;//页码 5 ????var top = index == 1 ? 1 : parseInt(index - 1); 6 ????var buttom = index == pageTotal ? pageTotal : parseInt(index + 1); 7 ????htmlShow += "<li><a class=‘words wandn‘ href=‘javascript:void(0);‘ ?onclick=serach(1)>首页</a>"; 8 ????htmlShow += "<a class=‘words wandn‘ href=‘javascript:void(0);‘ ?onclick=serach(" + top + ")> <上页</a><span id=‘htmlnum‘></span>"; 9 ????//判断显示的页码10 ????var indexTop = Math.floor((index-1) / 5);11 ????var index5 = parseInt(indexTop * 5 + 5) > pageTotal ? pageTotal : parseInt(indexTop * 5 + 5);12 ????htmlShow += "<a class=‘words wandn‘ href=‘javascript:void(0);‘ onclick=serach(" + buttom + ")>下页></a>";13 ????htmlShow += "<a class=‘words wandn‘ href=‘javascript:void(0);‘ onclick=serach(" + pageTotal + ")>末页</a>";14 ????htmlShow += "<span class=‘fy‘>" + index + "/" + pageTotal + "</span><div class=‘zd_page‘>转到&nbsp;&nbsp;<input id=‘btnSelect‘/><div class=‘goout‘ id=‘go‘>GO</div></div></li>";15 ????$("#showPage").html(htmlShow);16 ????var htmlnum = "";17 ????for (var i = parseInt(indexTop*5+1); i < index5+1; i++) {18 ????????htmlnum += "<a class=‘num wandn‘ href=‘javascript:void(0);‘ ?onclick=serach(" + i + ")>" + i + "</a>";//展示的数字19 ????}20 ????$("#htmlnum").html(htmlnum);21 }

这里第10、11行的5,所产生的效果是每当点击的页码为(5n+1)时,下方的页码开始变动,可以重新设置参数,没必要写死

JS分页方法

原文地址:http://www.cnblogs.com/yuchenghao/p/7918933.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved