<title>分页</title> <script type="text/javascript" src="js/jquery-1.11.3.js"></script> <style type="text/css"> .table{border:solid #FFAEB9; border-width:1px 0px 0px 1px;width: 100%;font-size: 12px;line-height: 21px;text-align:center;} .table thead td{border:solid #FFAEB9; border-width:0px 1px 1px 0px;} .table tbody td{border:solid #FFAEB9; border-width:0px 1px 1px 0px;padding-right: 5px;padding-left: 5px;} </style>

<script type="text/javascript"> //编造表数据 //表头 var head= ''+ ' 姓 名 '+ ' 年 龄 '+ ' 彦 值* '+ ' 成 绩 '+ ' 身 高cm '+ ''; //表内容，后台返回的内容可以封装到这里，随时取用，但是如果数据量很大估计会相当耗资源。 var pageData=[]; for(var i=1;i<100;i++){ var data=''+ '学生'+i+''+ ''+Math.round(Math.random()*20)+''+ ''+Math.round(Math.random()*5)+'颗星'+ ''+Math.round(Math.random()*100)+''+ ''+Math.round(Math.random()*200)+'cm'+ ''; pageData.push(data); } //表结尾 var end='';

$(function(){
var Count = pageData.length;//记录条数
var PageSize=10;//设置每页示数目
var PageCount=Math.ceil(Count/PageSize);//计算总页数
var currentPage =1;//当前页，默认为1。
//造个简单的分页按钮
for(var i=1;i<=PageCount;i++){
var pageN='第'+i+'页';
$('#page').append(pageN);
}
//显示默认页（第一页）
$('#table').empty().append(head);
for(i=(currentPage-1)PageSize;i<PageSizecurrentPage;i++){
$('#table').append(pageData[i]);
}
$('#table').append(end);

//显示选择页的内容  
$('a').click(function(){  
 var selectPage=$(this).attr('selectPage');  
 $('#table').html('');  
    $('#table').append(head);  
    for(i=(selectPage-1)*PageSize;i<PageSize*selectPage;i++){  
        $('#table').append(pageData[i]);  
    }  
    $('#table').append(end);  
});  

});
</script>