在使用mybatis3,并且使用分页,PageHelper 接口,分页还是很好使用的。使用pageInfo的后台分页接口。

/**
*
* @param switchPage方法,切换页码方法
*
* function switchPage(pageNum){
$("input[name='pageNum']").val(pageNum);
$("#blgTable tr:gt(0)").remove();
getLuoJiaoDianResult(); }
*
* @getResult() 获取结果集方法
*
* function getLuoJiaoDianResult(){
var dat=serializeObject("#dizhi");
$.post("${BASE_PATH}dz/list",dat,function(data){
$("#blgTable tr:gt(0)").remove();
var option="";
if(data.list.length==0){
option+="<tr><td colspan='6'> 没有符合条件的查询结果!</td></tr>" }else{
$(data.list).each(function(i){
if(this.fenquzhihuibu==null){
this.fenquzhihuibu="";
}
if(this.paichusuo==null){
this.paichusuo="";
} if(i%2==0){
option+="<tr style='background:rgb(243, 248, 251)'>";
}else{
option+="<tr style='background:rgb(226, 237, 247)'>";
}
option+="<td>"+this.xingming+"</td><td>"+
this.shenfenzheng+"</td><td>"+this.dizhi+"</td><td> "+
this.fenquzhihuibu+" </td><td>"+this.paichusuo+"</td><td><a onclick=selectPersonInfo('"+this.personid+"') >详情</a></td></tr>"; });
}
pageInfoBar(data,"pagebar");
$("#blgTable").append(option); },"json");
}
*
*
*
* 获取分页导航条
* @param pageInfo
* @param barDivId
*/
function pageInfoBar(pageInfo, barDivId) {
var barDiv = $("#" + barDivId);
var context = "<span>当前页:" + pageInfo.pageNum + "&nbsp;总页数:"
+ pageInfo.pages + "&nbsp;&nbsp;总记录数:"+pageInfo.total+"</span>";
context += "<div class='query-content-page-btn'><ul>";
if (pageInfo.pageNum > 1) {
context += "<li class='prev-next' onclick=switchPage('"
+ pageInfo.prePage + "')>上一页</li>";
}
for (var i = 0; i < pageInfo.navigatepageNums.length; i++) {
if (pageInfo.pageNum == pageInfo.navigatepageNums[i]) {
context += "<li class='query-content-page-cur' onclick=switchPage('"
+ pageInfo.navigatepageNums[i]
+ "')>"
+ pageInfo.navigatepageNums[i] + "</li>"
} else {
context += "<li onclick=switchPage('"
+ pageInfo.navigatepageNums[i] + "')>"
+ pageInfo.navigatepageNums[i] + "</li>"
} } if (pageInfo.pageNum < pageInfo.pages) {
context += "<li class='bus-border-right prev-next' onclick=switchPage('"
+ pageInfo.nextPage + "')>下一页</li>";
}
context += "</ul></div>";
barDiv.html(context);
}

PageInfo 前台分页js,带分页栏的更多相关文章

  1. js得到分页栏

    自己写的,感觉返回html代码蠢蠢的,但是新手并不知道怎么写更好的,感觉这样子也蛮简单.记录下来,以后来越改越好. //获得分页栏.注意indexSize为奇数,这样也比较好看 //totalNum: ...

  2. JS-网页中分页栏

    原理 三部分 我给分页栏分成了3部分 上一页:调用prePage()函数 下一页:调用nextPage()函数 带有数字标识的部,调用skipPage()函数 prePage函数 function p ...

  3. js 带省略号的分页源码及应用实例

    一.js:pagination.js /*--说明分页div id为:changpage*/var eachPageDataNum = 10;//每页显示记录数var nowPage = 1;//当前 ...

  4. 单篇文章JS模拟分页

    废话部分 前两天做了一个前台分页插件,支持ajax读取数据绑定前台 和 url带页码参数跳转两种方式.于是稍加改动,做了一个单篇文章js模拟分页的代码,为什么说是模拟分页呢?因为在服务器响应HTML请 ...

  5. EasyUI的DataGrid 分页栏英文改中文解决方案

    (一)分页栏英文改中文解决方案 这个问题其实很简单,就是引入文件jquery-easyui-1.3/locale/easyui-lang-zh_CN.js . 注意这个文件要放在本页js的后面,放在最 ...

  6. Mvc 分页栏扩展方法

    using System; using System.Collections.Generic; using System.Reflection; using System.Text; using Sy ...

  7. js前端分页之jQuery

    锋利的js前端分页之jQuery 大家在作分页时,多数是在后台返回一个导航条的html字符串,其实在前端用js也很好实现. 调用pager方法,输入参数,会返回一个导航条的html字符串.方法的内部比 ...

  8. “MVC+Nhibernate+Jquery-EasyUI” 信息发布系统 第六篇(图片新闻的添加以及带分页的静态页的生成)

    “MVC+Nhibernate+Jquery-EasyUI” 信息发布系统 第六篇(图片新闻的添加以及带分页的静态页的生成) 一.这篇文章主要是要实现:图片新闻的添加,无刷新图片的上传,以及添加新闻静 ...

  9. Spring统一返回Json工具类,带分页信息

    前言: 项目做前后端分离时,我们会经常提供Json数据给前端,如果有一个统一的Json格式返回工具类,那么将大大提高开发效率和减低沟通成本. 此Json响应工具类,支持带分页信息,支持泛型,支持Htt ...

随机推荐

  1. twitter oa

    字符串括号匹配有效性: 要求从直接return改成了返回yes or no.需要添加到list后break,然后每次循环之前,boolean要重新初始化. array index报错是什么鬼?算了,脑 ...

  2. XML 解析技术

    xml 解析方式有两种: dom 解析和 sax 解析: 针对着两种解析方式,有三种解析器: sun公司的 jaxp dom4j 组织的 dom4j jdom 组织的 jdom dom 解析XML : ...

  3. shell脚本计算斐波那契数列

    计算斐波那契数列 [1,1,2,3,5,8,,,,,] #!/bin/bash n=$ num=( ) i= while [[ $i -lt $n ]] do let num[$i]=num[$i-] ...

  4. 文件操作 day8

    一,文件操作基本流程. 计算机系统分为:计算机硬件,操作系统,应用程序三部分. 我们用python或其他语言编写的应用程序若想要把数据永久保存下来,必须要保存于硬盘中,这就涉及到应用程序要操作硬件,众 ...

  5. “windows的批处理”与“Linux的shell script”的类比学习

    从2005年开始,做了将近10年的系统维护,先是做网络接入管理,然后做网络安全与审计,然后做服务器管理等整个网络系统的运营管理:现在又兼着做一些Linux下的视频监控系统的软硬件维护.过程中遇到太多重 ...

  6. Linux定时任务Crontab使用 提示no crontab for root

    使用命令查询crontab 任务时,一直提示:no crontab for root .查看了一些资料,说是crontab在初始时,设置了一次编辑方式,所以试了一下crontab -e的方式编辑,即在 ...

  7. PHP 文件操作代码

    <?php //echo filetype("./1.jpg"); //判断文件类型 文件:file //echo filetype("./code"); ...

  8. iOS.UI.UIWindow

    UIWindow 1. UIWindow 2. UIWindow的使用场景 2.1 额外添加的Window需要手动进行旋转 最近有遇到一个UIWindow的使用场景:在ApplicationDeleg ...

  9. Codeforces55D Beautiful numbers

    原题链接 虽然依旧是套模板,但是因为我太弱了,不会建状态,所以去看了题解.. 这里就直接引用我看的题解吧,写的不错的. 题解 //我的代码 #include<cstdio> #includ ...

  10. a label can only be part of statement and a declaratioin is not a statement

    参考资料: https://stackoverflow.com/questions/18496282/why-do-i-get-a-label-can-only-be-part-of-a-statem ...