背景:
从后台提取出来数据,在前端进行分页。
代码:
user-manage.js
window.onload = function(){ var result = { message : "get all users successfully", status: "success", data:[ "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13" ] }; var currentPage = 1: var pageSize = 10; var count = result.data.length; var totalPage = Math.ceil(count / pageSize); pagination(result,currentPage,pageSize); function pagination(result,currentPage,pageSize){ var initSerialNumber = new Array(); for(var i = 0;i<result.data.length;i++){ initSerialNumber[i] = i; } $("#current-page").text("当前第"+currentPage+"页"); $("#total-page").text("共"+totalPage+"页"); var us erNameContent = result.data.slice((currentPage-1)*pageSize,currentPage*pageSize); var serialNumberContent = initSerialNumber.slice((currentPage-1)*pageSize,currentPage*pageSize); var str = ""; for(var i = 0;i < userNameContent.length;i++){ str +="<tr><td>"+(serialNumberContent[i]+1)+"</td><td>"+userNameContent[i]+"</td></tr>"; $("#all-user").empty(); $("#all-user").append(str); } $("#next-page").click(function(){ if(currentPage!=totalPage){ currentPage = currentPage+1; pagination(result,currentPage,pageSize); } }); $("#previous-page").click(function{ if(currentPage!=totalPage){ currentPage = currentPage+1; pagination(result,currentPage,pageSize); } }); $("#go").click(function(){ var goPage = $("#go-page").val(); if(goPage>=1 && goPage <= totalPage){ currentPage = parseInt(goPage); pagination(result,currentPage,pageSize); } }) } }