pagination 插件下载:https://download.csdn.net/download/weixin_40652498/12313663
<link rel="stylesheet" href="lib/pagination.css" />
<script type="text/javascript" src="lib/jquery.min.js"></script>
<script type="text/javascript" src="lib/jquery.pagination.js"></script>
<div id="Searchresult">分页内容(自动替换)</div>
<div style="margin-left: 330px"><div id="Pagination" class="pagination" ><!-- 这里显示分页 --></div></div>
$(function(){
//这是一个非常简单的demo实例,让列表元素分页显示
//回调函数的作用是显示对应分页的列表项内容
//回调函数在用户每次点击分页链接的时候执行
//参数page_index{int整型}表示当前的索引页
var initPagination = function() { //页码加载
var num_entries = 1; //有多少个分页
$.ajax({
url: "selectPageNum",
async:false, //同步请求
success: function (size) {
num_entries=size;
}
});
// 创建分页
$("#Pagination").pagination(num_entries, {
num_edge_entries: 1, //边缘页数
num_display_entries: 4, //主体页数
callback: pageselectCallback,
items_per_page:1 //每页显示1项
});
}();
function pageselectCallback(page_index, jq){ //切换页数
var new_content=" <table id='table' class='table table-bordered' style='width: 800px'>"+
"<tr> <td><font color='red'>eid</font></font></td><td><font color='red'>ename</font></td><td><font color='red'>did</font></td><td><font color='red'>dname</font></td><td><font color='red'>daddress</font></td><td><button onclick='addData()'><font color='#4c84ff'>添加</font></button></td> </tr>";
$.ajax({
url: "select",
async:false, //同步请求
data: {start: page_index, leng: 10},
success: function (data) {
var list = eval("("+data+")"); //返回List 数据
for(var i=0;i<list.length;i++){
new_content+=" <tr>";
new_content +="<td>"+ list[i].eid+"</td>";
new_content +="<td>"+ list[i].ename+"</td>";
new_content +="<td>"+ list[i].dno.did+"</td>";
new_content +="<td>"+ list[i].dno.dname+"</td>";
new_content +="<td>"+ list[i].dno.daddress+"</td>";
new_content +="<td>"+ "<button onclick='updateData(\""+list[i].eid+"\")'><font color='#4c84ff'>修改</font></button> <button onclick='deleteData(\""+list[i].eid+"\")'><font color='#4c84ff'>删除</font></button>";+"</td>";
new_content+=" </tr>";
}
new_content+=" </table>";
}
});
$("#Searchresult").empty().append(new_content); //装载对应分页的内容
return false;
}
});