利用JQuery写一个简单的异步分页插件_jquery

来源：动视网责编：小采时间：2020-11-27 20:51:52

利用JQuery写一个简单的异步分页插件_jquery

利用JQuery写一个简单的异步分页插件_jquery:写了一个Jquery异步分页插件，拿出来分享一下，有不完善之处请指教。以用户分页为例，先看一下效果，首先是第一页：下一页或者点击第二页后：点击尾页后：效果还可以吧？来看看具体怎么用，首先后台要有一个Page模型： Page.java： publ

推荐度：

点击下载本文 文档为doc格式

导读利用JQuery写一个简单的异步分页插件_jquery:写了一个Jquery异步分页插件，拿出来分享一下，有不完善之处请指教。以用户分页为例，先看一下效果，首先是第一页：下一页或者点击第二页后：点击尾页后：效果还可以吧？来看看具体怎么用，首先后台要有一个Page模型： Page.java： publ

写了一个Jquery异步分页插件，拿出来分享一下，有不完善之处请指教。
以用户分页为例，先看一下效果，首先是第一页：

下一页或者点击第二页后：

点击尾页后：

效果还可以吧？来看看具体怎么用，首先后台要有一个Page模型：
Page.java：

public class Page { 
 
 /** 
 * 当前页号 
 */ 
 private int currPageNum = 1; 
 
 
 /** 
 * 总记录数 
 */ 
 private int totalRowSize = 0; 
 
 /** 
 * 每页记录数 
 */ 
 private int pageRowSize = 10; 
 
 public int getCurrPageNum() { 
 return currPageNum; 
 } 
 
 public void setCurrPageNum(int currPageNum) { 
 this.currPageNum = currPageNum; 
 } 
 
 public int getTotalPageNum() { 
 int total = (totalRowSize%pageRowSize==0)?(totalRowSize/pageRowSize):(totalRowSize/pageRowSize+1); 
 return total; 
 } 
 
 public int getTotalRowSize() { 
 return totalRowSize; 
 } 
 
 public void setTotalRowSize(int totalRowSize) { 
 this.totalRowSize = totalRowSize; 
 } 
 
 public int getPageRowSize() { 
 return pageRowSize; 
 } 
 
 public void setPageRowSize(int pageRowSize) { 
 this.pageRowSize = pageRowSize; 
 } 
 
 public int getFirstResult(){ 
 if(getCurrPageNum()<=0) return 0; 
 
 return getPageRowSize() * (getCurrPageNum() - 1); 
 } 
 
 public int getMaxResult() { 
 return this.getFirstResult()+this.getPageRowSize(); 
 } 
 
}

然后看list_user.jsp：

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> 
 
 
  
 异步分页

可以看到id为tbody的元素是作为分页内容展示容器，id为pageWidget的元素作为分页控件展示容器。
然后提供了一个buildHtml()函数来具体构建分页内容的。
使用异步分页插件很简单，只要这么调用：

这是最简化调用。还可以传额外查询参数，以及定制每页显示记录数，具体使用方式见插件的具体介绍。
下面是asynPage插件内容：

利用JQuery写一个简单的异步分页插件_jquery

推荐度：

点击下载本文 文档为doc格式

标签：简单 jQuery 分页插件

热门焦点

利用JQuery写一个简单的异步分页插件_jquery

利用JQuery写一个简单的异步分页插件_jquery

利用JQuery写一个简单的异步分页插件_jquery

最新推荐

猜你喜欢

热门推荐