<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Untitled Document</title>
<style type="text/css">
.goto{ line-height:16px;}
</style>
<script language="javascript">
var array = new Array()
array[0] = "1d";
array[1] = "2f";
array[2] = "3";
array[3] = "4";
array[4] = "5";
array[5] = "6";
array[6] = "7";
array[7] = "8";
array[8] = "9";
array[9] = "10";
array[10] = "c11";
array[11] = "c12";
array[12] = "c13";
array[13] = "c14";
array[14] = "c15";
array[15] = "c16";
for(i=0;i<array.length;i++)
{
document.write(array[i]+"<br/>");
}
var pagesize = 5;
var totalRecord = array.length;
var totalPage;
if(totalRecord%pagesize==0)
{
totalPage = totalRecord/pagesize;
}
else
{
totalPage = parseInt(totalRecord/pagesize+1);
}
document.write("pagesize:"+pagesize+"<br/>");
document.write("totalRecord:"+totalRecord+"<br/>");
document.write("totalPage:"+totalPage+"<br/>");
function showPage(pagesize,page)
{
var str = "";
var start = (Number(page)-1)*pagesize;
//document.write(start);
if(start<0)
{
start = 0;
}
if(page<1)
{
page = 1;
}
else if(page>totalPage)
{
page = totalPage;
}
var end = Number(page)*pagesize;
var prev = Number(page)-1;
if(page==totalPage)
{
next = totalPage;
}
else
{
next = Number(page)+1;
}
if(totalRecord%pagesize==0)
{
for(var i=start;i<end;i++)
{
str += array[i]+"--";
}
}
else
{
if(page<totalPage)
{
for(var i=start;i<end;i++)
{
str += array[i]+"--";
}
}
else if(page==totalPage)
{
for(var i=start;i<totalRecord;i++)
{
str += array[i]+"--";
}
}
}
arrayStr.innerHTML = "<font color='#ff0000'>"+str+"</font>";
strTemp = " ";
var Str = "<a href='#' onclick='showPage("+pagesize+",1);'>First</a>"+strTemp+"<a href='#' onclick='showPage("+pagesize+","+prev+");'>Prev</a>"+strTemp+"<a href='#' onclick='showPage("+pagesize+","+next+");'>Next</a>"+strTemp+"<a href='#' onclick='showPage("+pagesize+","+totalPage+");'>Last</a>";
var inputStr = "<input type='text' id='pageInput' style='height:15px' size='3'>";
var gotoStr = "<input type='button' name='go' value='Go' onClick='goto();' class='goto'>";
pageStr.innerHTML = Str + strTemp + inputStr +" "+ gotoStr;
}
function goto()
{
var inputValue = parseInt(document.getElementById("pageInput").value);
if(document.getElementById("pageInput").value=="")
{
alert("请输入页码!");
}
else if(inputValue<0)
{
showPage(pagesize,1);
}
else if(inputValue>totalPage)
{
alert("输入页码错误!");
}
else
{
showPage(pagesize,inputValue);
}
}
</script>
</head>
<body>
<a href="#" onclick="showPage(5,1);">test</a>
<span id="arrayStr">loading...page</span>
<span id="pageStr">loading...page</span>
</body>
</html>