龙空技术网

js分页模块

程闻一说 25

前言:

眼前各位老铁们对“js分页计算”大致比较关切,各位老铁们都需要了解一些“js分页计算”的相关文章。那么小编在网摘上网罗了一些对于“js分页计算””的相关内容,希望我们能喜欢,大家一起来学习一下吧!

一个简单的js分页小模块

<!DOCTYPE html><html><head><meta charset="utf-8"></head><body><div id="pg">Hello World!</div></body></html><script>//url连接,countdatas表数据总行数,currentpage第几页(0是第一页),everpage每页多少行,beforlaterln前后长度function pagestr(url,countdatas,currentpage,everpage,beforlaterln){    var page= "";    var intpart = Math.floor(countdatas/everpage);//整数    var remainderpart = countdatas%everpage;//余数    var countpage = intpart;//取整数    var currentpage = currentpage<0 ? 0:currentpage;    if(remainderpart==0){//余数判断            currentpage=currentpage>countpage-1?countpage-1:currentpage;            var pp=currentpage+1;            var strbe="";            var pagebefore=pp-beforlaterln-1;            for(var i=pp; i > pagebefore; i--){                if(i>0 && i<pp){                    strbe="<a class='num' href='"+url+"&p="+(i-1)+"'>"+i+"</a>"+strbe;                }            }           if(pp<=1){strbe="";}else{strbe="<a class='num' href='"+url+"&p=0'>首页</a>"+"<a class='num' href='"+url+"&p="+(pp-2)+"'>上一页</a>"+strbe;}            var strmid="<span class='current'>"+pp+"</span>";            var strlater="";            var pagelater=pp+beforlaterln;            for(var i=pp; i < pagelater; i++){                if(i<countpage){                    strlater+="<a class='num' href='"+url+"&p="+(i)+"'>"+(i+1)+"</a>";                }            }            if(pp>=countpage){}else{strlater+="<a class='num' href='"+url+"&p="+pp+"'>下一页</a>"+"<a class='num' href='"+url+"&p="+(countpage-1)+"'>尾页</a>";}            page=strbe+strmid+strlater;        /**/     }else {            countpage+=1;//总页数            currentpage=currentpage>countpage-1?countpage-1:currentpage;            var pp=currentpage+1;            var strbe="";            var pagebefore=pp-beforlaterln-1;            for(var i=pp; i > pagebefore; i--){                 if(i>0 && i<pp){                    strbe="<a class='num' href='"+url+"&p="+(i-1)+"'>"+i+"</a>"+strbe;                }            }            if(pp<=1){strbe="";}else{strbe="<a class='num' href='"+url+"&p=0'>首页</a>"+"<a class='num' href='"+url+"&p="+(pp-2)+"'>上一页</a>"+strbe;}            var strmid="<span class='current'>"+pp+"</span>";            var strlater="";            var pagelater=pp+beforlaterln;            for(var i=pp; i < pagelater; i++){                if(i<countpage){                    strlater+="<a class='num' href='"+url+"&p="+(i)+"'>"+(i+1)+"</a>";                }            }            if(pp>=countpage){}else{strlater+="<a class='num' href='"+url+"&p="+pp+"'>下一页</a>"+"<a class='num' href='"+url+"&p="+(countpage-1)+"'>尾页</a>";}            page=strbe+strmid+strlater;        }        return "共"+countpage+"页"+page;}var page=pagestr(";,195,11,10,8);    document.getElementById("pg").innerHTML=page;   </script>

运行后得到一下字符串

共20页<a class='num' href=';>首页</a><a class='num' href=';>上一页</a><a class='num' href=';>4</a><a class='num' href=';>5</a><a class='num' href=';>6</a><a class='num' href=';>7</a><a class='num' href=';>8</a><a class='num' href=';>9</a><a class='num' href=';>10</a><a class='num' href=';>11</a><span class='current'>12</span><a class='num' href=';>13</a><a class='num' href=';>14</a><a class='num' href=';>15</a><a class='num' href=';>16</a><a class='num' href=';>17</a><a class='num' href=';>18</a><a class='num' href=';>19</a><a class='num' href=';>20</a><a class='num' href=';>下一页</a><a class='num' href=';>尾页</a>

希望对大家有帮助,谢谢!

标签: #js分页计算 #原生js分页效果