jquery分页

时间：2024-11-02 09:24:28编辑：阿奇

jquery动态怎么实现表格分页

Document 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 window.onload = function () { goPage(1) } function goPage(pno) { var itable = document.getElementById("result"); var num = itable.rows.length; //表格所有行数(所有记录数) console.log(num); var totalPage = 0; //总页数 var pageSize = 3; //每页显示行数 //总共分几页 if (num / pageSize > parseInt(num / pageSize)) { totalPage = parseInt(num / pageSize) + 1; } else { totalPage = parseInt(num / pageSize); } var currentPage = pno; //当前页数 var startRow = (currentPage - 1) * pageSize + 1; //开始显示的行 31 var endRow = currentPage * pageSize; //结束显示的行 40 endRow = (endRow > num) ? num : endRow; //40 //遍历显示数据实现分页 for (var i = 1; i = startRow && i 共" + totalPage + "页"; if (currentPage > 1) { tempStr += "首页"; tempStr += "上一页" } else { tempStr += "首页"; tempStr += "上一页"; } if (totalPage == 1) { tempStr += "" + currentPage + "" } else if (totalPage == 2 && currentPage == 1) { tempStr += "" + currentPage + "" + "" + (currentPage + 1) + "" } else if (totalPage == 2 && currentPage == 2) { tempStr += "" + (currentPage - 1) + "" + "" + currentPage + "" } else if (totalPage >= 3 && currentPage == 1) { tempStr += "" + currentPage + "" + "" + (currentPage + 1) + "" + "" + ( currentPage + 2) + "" } else if (totalPage >= 3 && currentPage == totalPage) { tempStr += "" + (currentPage - 2) + "" + "" + (currentPage - 1) + "" + "" + currentPage + "" } else { tempStr += "" + (currentPage - 1) + "" + "" + currentPage + "" + "" + ( currentPage + 1) + "" } if (currentPage 下一页"; tempStr += "尾页"; } else { tempStr += "下一页"; tempStr += "尾页"; } document.getElementById("barcon").innerHTML = tempStr; } 自己修改一下table中元素的CSS样式，分页页码的样式，就能看出来效果了

在jQuery中如何实现动态数据分页

实现html页面的分页查询，请问如何用jquery

动态的Ajax分页，代码如下：" />Insert title herevar list; // the list of datavar totalPages; // the total of pagesvar pageSize = 5; // each size of pagevar pageIndex = 1; // the index of current page$(function(){send();});function send() {$.ajax({url: "DistrictServlet",type: "POST",data: {"function":"list"},dataType: "json",success: function(data) {// list = data;var records = data.length;if (records % pageSize == 0) {totalPages = records / pageSize;} else {totalPages = Math.round(records / pageSize);}$("#pageIndex").html(pageIndex);$("#totalPages").html(totalPages);binding(data);}});}function changePage() {$.ajax({url: "DistrictServlet",type: "post",data: {"function":"list"},dataType: "json",success: function(data) {binding(data);}});}function binding(data) {var start = (pageIndex - 1) * pageSize;var end = pageIndex * pageSize;var html = "";$.each(data, function(index, district) {if (index >= start && index " + district["id"]+ "" +district["name"]+""; // .........}});$("table").html(html);$("#pageIndex").html(pageIndex);}function nextPage() {pageIndex += 1;if (pageIndex > totalPages) {pageIndex = totalPages;return;}changePage();}function lastPage() {pageIndex -= 1;if (pageIndex /lastnext

如何用jquery 实现html页面的分页查询

5
10
20

Entries Per Page

首页
上一页
下一页
尾页

/

下面是JS部分,放到最后(之前):

var sorter = new TINY.table.sorter("sorter");
sorter.head = "head";
sorter.asc = "asc";
sorter.desc = "desc";
sorter.even = "evenrow";
sorter.odd = "oddrow";
sorter.evensel = "evenselected";
sorter.oddsel = "oddselected";
sorter.paginate = true;
sorter.currentid = "currentpage";
sorter.limitid = "pagelimit";
sorter.init("table",1);

下面是pagescript.js

var TINY={};

function T$(i){return document.getElementById(i)}
function T$$(e,p){return p.getElementsByTagName(e)}

TINY.table=function(){
function sorter(n){this.n=n; this.pagesize=10; this.paginate=0}
sorter.prototype.init=function(e,f){
var t=ge(e), i=0; this.e=e; this.l=t.r.length; t.a=[];
t.h=T$$('thead',T$(e))[0].rows[0]; t.w=t.h.cells.length;
for(i;i<t.w;i++){
var c=t.h.cells[i];
if(c.className!='nosort'){
c.className=this.head; c.onclick=new Function(this.n+'.wk(this.cellIndex)')
}
}
for(i=0;i<this.l;i++){t.a[i]={}}
if(f!=null){var a=new Function(this.n+'.wk('+f+')'); a()}
if(this.paginate){this.g=1; this.pages()}
};
sorter.prototype.wk=function(y){
var t=ge(this.e), x=t.h.cells[y], i=0;
for(i;i<this.l;i++){
t.a[i].o=i; var v=t.r[i].cells[y]; t.r[i].style.display='';
while(v.hasChildNodes()){v=v.firstChild}
t.a[i].v=v.nodeValue?v.nodeValue:''
}
for(i=0;i<t.w;i++){var c=t.h.cells[i]; if(c.className!='nosort'){c.className=this.head}}
if(t.p==y){t.a.reverse(); x.className=t.d?this.asc:this.desc; t.d=t.d?0:1}
else{t.p=y; t.a.sort(cp); t.d=0; x.className=this.asc}
var n=document.createElement('tbody');
for(i=0;i<this.l;i++){
var r=t.r[t.a[i].o].cloneNode(true); n.appendChild(r);
r.className=i%2==0?this.even:this.odd; var cells=T$$('td',r);
for(var z=0;z<t.w;z++){cells[z].className=y==z?i%2==0?this.evensel:this.oddsel:''}
}
t.replaceChild(n,t.b); if(this.paginate){this.size(this.pagesize)}
};
sorter.prototype.page=function(s){
var t=ge(this.e), i=0, l=s+parseInt(this.pagesize);
if(this.currentid&&this.limitid){T$(this.currentid).innerHTML=this.g}
for(i;i=s&&i<l?'':'none'}
};
sorter.prototype.move=function(d,m){
var s=d==1?(m?this.d:this.g+1):(m?1:this.g-1);
if(s0){this.g=s; this.page((s-1)*this.pagesize)}
};
sorter.prototype.size=function(s){
this.pagesize=s; this.g=1; this.pages(); this.page(0);
if(this.currentid&&this.limitid){T$(this.limitid).innerHTML=this.d}
};
sorter.prototype.pages=function(){this.d=Math.ceil(this.l/this.pagesize)};
function ge(e){var t=T$(e); t.b=T$$('tbody',t)[0]; t.r=t.b.rows; return t};
function cp(f,c){
var g,h; f=g=f.v.toLowerCase(), c=h=c.v.toLowerCase();
var i=parseFloat(f.replace(/(\$|\,)/g,'')), n=parseFloat(c.replace(/(\$|\,)/g,''));
if(!isNaN(i)&&!isNaN(n)){g=i,h=n}
i=Date.parse(f); n=Date.parse(c);
if(!isNaN(i)&&!isNaN(n)){g=i; h=n}
return g>h?1:(g<h?-1:0)
};
return{sorter:sorter}
}();

//
//
//var sorter = new TINY.table.sorter("sorter");
//sorter.head = "head";
//sorter.asc = "asc";
//sorter.desc = "desc";
//sorter.even = "evenrow";
//sorter.odd = "oddrow";
//sorter.evensel = "evenselected";
//sorter.oddsel = "oddselected";
//sorter.paginate = true;
//sorter.currentid = "currentpage";
//sorter.limitid = "pagelimit";
//sorter.init("table",1);
//

上一篇：bluestacksappplayer

下一篇：没有了