间隔为2的幂次的翻页js实现
HTML
x
73
73
1
<html>2
<head>3
<style>4
div {5
padding: 20px;6
}7
.page-links a.post-page-numbers {8
padding: 7px 10px;9
border: solid #6AA 2px;10
border-radius: 4px;11
}12
.page-links span.post-page-numbers {13
padding: 7px 10px;14
border: solid #88D 2px;15
border-radius: 20px;16
}17
</style>18
</head>19
<body>20
</body>21
<script>22
23
function printPageHref(pi,gap) {24
document.write("<a href=\"https://www.malic.xyz/archives/4298/" + pi +"\" class=\"post-page-numbers\"><ruby> "+ pi + "<rt>" + gap + "</rt></ruby></a>");25
}26
function listPageNext(curr,total)27
{28
page = curr+1;29
gap = 2;30
while(page < total ){31
printPageHref(page,"(+" + (page-curr) + ")");32
page = Math.min(page + gap,total);33
gap = gap * 2;34
}35
printPageHref(page,"(+" + (page-curr) + ")");36
}37
38
function listPagePrev(curr)39
{40
page = curr-1;41
gap = 2;42
arr = new Array();43
while(1 < page) {44
arr.unshift(page);45
page = Math.max(page - gap,1);46
gap = gap * 2;47
}48
if(arr.indexOf(1) < 0) {49
arr.unshift(1);50
}51
for(k = 0;k<arr.length;k++){52
printPageHref(arr[k],"(-"+ (curr-arr[k]) + ")");53
}54
}55
56
totalPage = 21;57
58
function main(currp){59
document.write("<div class=\"page-links\">");60
if(currp>1){listPagePrev(currp);}61
document.write( "<span class=\"post-page-numbers current\" aria-current=\"page\">" + currp + "</span>");62
if(currp<totalPage){listPageNext(currp,totalPage);}63
document.write("</div>"); 64
}65
66
67
for(i=1;i<=totalPage;i++) {68
main(i);69
}70
71
</script>72
</html>73