最简单的 DIV + Javascript 分页演示代码

来源：互联网发布：海盗湾电影源码编辑：程序博客网时间：2024/05/16 18:39

手中有一个改进Web Part 的任务，要求加一个分页，及对应前一页，后一页导航，以下为一个很简单的验证代码:

function getNextPage()
{
curPage = parseInt(curPage)+1;
if (curPage > maxPage) curPage = maxPage;
selectedPageByNo(curPage);
}

function getPrePage()
{
curPage = parseInt(curPage)-1;
if (curPage < 0) curPage = 0;
selectedPageByNo(curPage);
}

</script>
</head>
<a href='javascript:selectedPageByNo(0);'> |< </a>
<a href='javascript:getPrePage();'> < </a>
<a href='javascript:selectedPageByID("Page1");'> 1 </a>
<a href='javascript:selectedPageByID("Page2");'> 2 </a>
<a href='javascript:selectedPageByID("Page3");'> 3 </a>
<a href='javascript:selectedPageByID("Page4");'> 4 </a>
<a href='javascript:selectedPageByID("Page5");'> 5 </a>
<a href='javascript:getNextPage();'> > </a>
<a href='javascript:selectedPageByNo(4);'> >| </a>

<hr>

<div id ='Page1' style='display:none'>
Hello!<br>This is testing Page 1.
</div>
<div id = 'Page2' style='display:none'>
Hello!<br>This is testing Page 2.
</div>
<div id = 'Page3' style='display:none'>
Hello!<br>This is testing Page 3.
</div>
<div id = 'Page4' style='display:none'>
Hello!<br>This is testing Page 4.
</div>
<div id = 'Page5' style='display:none'>
Hello!<br>This is testing Page 5.
</div>

</body>
</html>