纯JavaScript实现的分页插件实例

(编辑:jimmy 日期: 2026/1/17 浏览:2)

本文实例讲述了纯JavaScript实现的分页插件。分享给大家供大家参考。具体如下:

//总条数(必填)
var Num=Number(<"至少需要显示一个页码!");
}
var prev = index - 1;//上一页
var next = index+ 1;//下一页 
var str = "<tr>";
if(count==0){
 str += "<td>共<a href='#'>0</a>页</td><td>";
}else if(index>count||index<=0){
 str="<td style='color:blue;' >页码超出范围</td>";
}else if (count > 0) {
 str += "<td>";
 if(first>1){
  str += "&nbsp;&nbsp;<span style='color:#4169E1;' >...</span>&nbsp;&nbsp;";
 }
 var i=1;
 for(i=first;i<=last; i++){
  if(i==index){
   str += "&nbsp;&nbsp;<a href='#' style='color:#4169E1;' onclick='submit(" + i + ");'>[" + i+ "]</a>&nbsp;&nbsp;";
  }else{
   str += "&nbsp;&nbsp;<a href='#' onclick='submit(" + i + ");'>" + i+ "</a>&nbsp;&nbsp;";
  }
 } 
  if(last<count){
   str += "&nbsp;&nbsp;<span style='font-size:16px;color:#4169E1;' >...</span>&nbsp;&nbsp;"; 
  }
  str+="</td><td style='font-size: 14px;'>共<a href='#first' style='color:#4169E1;font-size: 16px;' >"+ Num +"</a>条</td>";
  /* if(index!=1){
   str +="<td style='width:60px;font-family: 微软雅黑;font-size: 14px;' ><a href='#' id='prev' onclick='submit(" + prev+ ");'>上一页</a></td>"; 
  }
  if(index<count){
   str +="<td style='width:60px;font-family: 微软雅黑;font-size: 14px;'><a href='#' id='next' onclick='submit("+ next + ");'>下一页</a></td>";
  }*/
  if(index!=1&&count>1){
   str += "<td style='width:40px;font-family: 微软雅黑;font-size: 14px;white-space: nowrap;'>&nbsp;&nbsp;<a href='#' id='first' name='first' onclick='submit(1);'>首页</a>&nbsp;&nbsp;</td>";
  }
  if(index!=count&&count>1&&index<count){
   str += "<td style='width:40px;font-family: 微软雅黑;font-size: 14px;white-space: nowrap;'>&nbsp;&nbsp;<a href='#' onclick='submit(" + count+ ");'>尾页</a>&nbsp;&nbsp;</td>" ;
  } 
   str+="</tr>";
}
//分页区域填写
$('.page').html(str);
<table class="page">
<tr><td>此处分页只需要传递给我当前页码和总页数即可</td></tr>
</table>
//根据页码查询,
function submit(pageIndex) {
 //var sortInfo = $.getUrlParam('sortInfo');//判断是哪一个页面的查询
 var url = "<"+pageIndex+"&field=<";
 window.location.href=url;
}

希望本文所述对大家的javascript程序设计有所帮助。

一句话新闻
微软与英特尔等合作伙伴联合定义“AI PC”:键盘需配有Copilot物理按键
几个月来,英特尔、微软、AMD和其它厂商都在共同推动“AI PC”的想法,朝着更多的AI功能迈进。在近日,英特尔在台北举行的开发者活动中,也宣布了关于AI PC加速计划、新的PC开发者计划和独立硬件供应商计划。
在此次发布会上,英特尔还发布了全新的全新的酷睿Ultra Meteor Lake NUC开发套件,以及联合微软等合作伙伴联合定义“AI PC”的定义标准。