基础平台项目之集成Jquery.pagination.js实现分页

本博客介绍基于Spring Data这款orm框架加上
Jquery.pagination插件实现的分页功能。

本博客是基于一款正在开发中的github开源项目的，项目代码地址：https://github.com/u014427391/jeeplatform
欢迎star(收藏)或者可以下载去学习，还在开发…

介绍一下Spring Data框架
spring Data : Spring 的一个子项目。用于简化数据库访问，支持NoSQL 和关系数据存储。
下面给出SpringData 项目所支持 NoSQL 存储：

MongoDB （文档数据库）
Neo4j（图形数据库）
Redis（键/值存储）
Hbase（列族数据库）

SpringData 项目所支持的关系数据存储技术：

JDBC
JPA

JPA Spring Data : 致力于减少数据访问层 (DAO) 的开发量。开发者只要写好持久层接口就好，然后其它的框架会帮程序员实现。

开发步骤：
【Spring Data实现数据获取】
本项目是采用maven的，所以可以参考一下我的maven配置：

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd"><parent><artifactId>muses</artifactId><groupId>org.muses</groupId><version>1.0-SNAPSHOT</version></parent><modelVersion>4.0.0</modelVersion><artifactId>jeeplatform-admin</artifactId><packaging>war</packaging><name>jeeplatform-admin Maven Webapp</name><url>http://maven.apache.org</url><properties><spring.version>4.1.5.RELEASE</spring.version><spring-data-jpa.version>1.4.2.RELEASE</spring-data-jpa.version><spring-data-commons.version>1.6.2.RELEASE</spring-data-commons.version><hibernate.version>4.3.8.Final</hibernate.version><shiro.version>1.2.3</shiro.version><lucene.version>4.7.2</lucene.version><druid.version>1.0.9</druid.version><poi.version>3.7</poi.version></properties><dependencies><!-- module start --><dependency><groupId>org.muses</groupId><artifactId>jeeplatform-core</artifactId><version>${jeeplatform.core.version}</version></dependency><dependency><groupId>org.muses</groupId><artifactId>jeeplatform-common</artifactId><version>1.0-SNAPSHOT</version></dependency><dependency><groupId>org.muses</groupId><artifactId>jeeplatform-oss</artifactId><version>${jeeplatform.oss.version}</version></dependency><dependency><groupId>org.muses</groupId><artifactId>jeeplatform-upms</artifactId><version>1.0-SNAPSHOT</version></dependency><!-- moudle end--><!-- servlet start--><dependency><groupId>javax.servlet</groupId><artifactId>servlet-api</artifactId><version>2.5</version><scope>provided</scope></dependency><!-- servlet end --><!-- jstl start--><dependency><groupId>jstl</groupId><artifactId>jstl</artifactId><version>1.2</version></dependency><dependency><groupId>taglibs</groupId><artifactId>standard</artifactId><version>1.1.2</version></dependency><!-- jstl end --><!-- log4j start--><dependency><groupId>log4j</groupId><artifactId>log4j</artifactId><version>${log4j.version}</version></dependency><!-- log4j end--><!-- json解析需要的jar start--><dependency><groupId>commons-beanutils</groupId><artifactId>commons-beanutils</artifactId><version>1.8.3</version></dependency><dependency><groupId>commons-collections</groupId><artifactId>commons-collections</artifactId><version>3.2.1</version></dependency><dependency><groupId>net.sf.ezmorph</groupId><artifactId>ezmorph</artifactId><version>1.0.6</version></dependency><dependency><groupId>commons-lang</groupId><artifactId>commons-lang</artifactId><version>2.5</version></dependency><dependency><groupId>commons-logging</groupId><artifactId>commons-logging</artifactId><version>1.2</version></dependency><dependency><groupId>net.sf.json-lib</groupId><artifactId>json-lib</artifactId><version>2.4</version><type>jar</type><classifier>jdk15</classifier><scope>compile</scope></dependency><!-- json解析需要的jar end --><!-- mysql start--><dependency><groupId>mysql</groupId><artifactId>mysql-connector-java</artifactId><version>${mysql.version}</version></dependency><!-- mysql end--><!-- commons --><dependency><groupId>commons-io</groupId><artifactId>commons-io</artifactId><version>2.0.1</version></dependency><dependency><groupId>commons-fileupload</groupId><artifactId>commons-fileupload</artifactId><version>1.2.2</version></dependency><!-- commons --><!-- spring framework start--><dependency><groupId>org.springframework</groupId><artifactId>spring-core</artifactId><version>${spring.version}</version></dependency><dependency><groupId>org.springframework</groupId><artifactId>spring-beans</artifactId><version>${spring.version}</version></dependency><dependency><groupId>org.springframework</groupId><artifactId>spring-context</artifactId><version>${spring.version}</version></dependency><dependency><groupId>org.springframework</groupId><artifactId>spring-context-support</artifactId><version>${spring.version}</version></dependency><dependency><groupId>org.springframework</groupId><artifactId>spring-jdbc</artifactId><version>${spring.version}</version></dependency><dependency><groupId>org.springframework</groupId><artifactId>spring-tx</artifactId><version>${spring.version}</version></dependency><dependency><groupId>org.springframework</groupId><artifactId>spring-test</artifactId><version>${spring.version}</version><scope>test</scope></dependency><dependency><groupId>org.springframework</groupId><artifactId>spring-web</artifactId><version>${spring.version}</version></dependency><!-- spring framework end --><!-- spring aop start--><dependency><groupId>org.springframework</groupId><artifactId>spring-aop</artifactId><version>${spring.version}</version></dependency><dependency><groupId>org.aspectj</groupId><artifactId>aspectjweaver</artifactId><version>1.6.10</version></dependency><!-- spring aop end --><!-- springMVC start--><dependency><groupId>org.springframework</groupId><artifactId>spring-webmvc</artifactId><version>${spring.version}</version></dependency><!-- springMVC end --><!-- spring data start--><dependency><groupId>org.springframework</groupId><artifactId>spring-orm</artifactId><version>${spring.version}</version></dependency><dependency><groupId>org.springframework.data</groupId><artifactId>spring-data-jpa</artifactId><version>${spring-data-jpa.version}</version></dependency><dependency><groupId>org.springframework.data</groupId><artifactId>spring-data-commons</artifactId><version>${spring-data-commons.version}</version></dependency><!-- spring data end --><!-- hibernate jpa start--><dependency><groupId>org.hibernate.javax.persistence</groupId><artifactId>hibernate-jpa-2.1-api</artifactId><version>1.0.0.Final</version></dependency><dependency><groupId>org.hibernate</groupId><artifactId>hibernate-core</artifactId><version>${hibernate.version}</version></dependency><dependency><groupId>org.hibernate</groupId><artifactId>hibernate-entitymanager</artifactId><version>${hibernate.version}</version></dependency><!-- hibernate jpa end --><!-- hibernate echache start--><dependency><groupId>org.slf4j</groupId><artifactId>slf4j-api</artifactId><version>1.6.1</version></dependency><dependency><groupId>net.sf.ehcache</groupId><artifactId>ehcache-core</artifactId><version>2.5.0</version></dependency><dependency><groupId>org.hibernate</groupId><artifactId>hibernate-ehcache</artifactId><version>${hibernate.version}</version></dependency><!-- hibernate echache end --><!-- 阿里的连接池druid start--><dependency><groupId>com.alibaba</groupId><artifactId>druid</artifactId><version>${druid.version}</version></dependency><!-- 阿里的连接池druid end--><!--shiro start--><dependency><groupId>org.apache.shiro</groupId><artifactId>shiro-all</artifactId><version>${shiro.version}</version></dependency><!-- shiro end--><!-- velocity start--><dependency><groupId>org.apache.velocity</groupId><artifactId>velocity</artifactId><version>1.6</version></dependency><dependency><groupId>org.apache.velocity</groupId><artifactId>velocity-tools</artifactId><version>2.0</version></dependency><!-- velocity end--><!-- lucene全文搜素引擎 start--><dependency><groupId>org.apache.lucene</groupId><artifactId>lucene-core</artifactId><version>${lucene.version}</version></dependency><dependency><groupId>org.apache.lucene</groupId><artifactId>lucene-analyzers-common</artifactId><version>${lucene.version}</version></dependency><dependency><groupId>org.apache.lucene</groupId><artifactId>lucene-queryparser</artifactId><version>${lucene.version}</version></dependency><dependency><groupId>org.apache.lucene</groupId><artifactId>lucene-memory</artifactId><version>${lucene.version}</version></dependency><dependency><groupId>org.apache.lucene</groupId><artifactId>lucene-highlighter</artifactId><version>${lucene.version}</version></dependency><!-- 注意IKAnalyzer没有maven坐标,请自行添加到本地仓库 --><dependency><groupId>org.wltea.analyzer</groupId><artifactId>IKAnalyzer</artifactId><version>2012FF_u1</version><scope>system</scope><systemPath>${basedir}/src/main/webapp/WEB-INF/lib/IKAnalyzer2012FF_u1.jar</systemPath></dependency><!-- lucene全文搜素引擎 end --><!-- log4j start--><dependency><groupId>log4j</groupId><artifactId>log4j</artifactId><version>${log4j.version}</version></dependency><!-- log4j end--><!-- json解析需要的jar start--><dependency><groupId>commons-beanutils</groupId><artifactId>commons-beanutils</artifactId><version>1.8.3</version></dependency><dependency><groupId>commons-collections</groupId><artifactId>commons-collections</artifactId><version>3.2.1</version></dependency><dependency><groupId>net.sf.ezmorph</groupId><artifactId>ezmorph</artifactId><version>1.0.6</version></dependency><dependency><groupId>commons-lang</groupId><artifactId>commons-lang</artifactId><version>2.5</version></dependency><dependency><groupId>commons-logging</groupId><artifactId>commons-logging</artifactId><version>1.2</version></dependency><dependency><groupId>net.sf.json-lib</groupId><artifactId>json-lib</artifactId><version>2.4</version><type>jar</type><classifier>jdk15</classifier><scope>compile</scope></dependency><!-- json解析需要的jar end --><!-- poi start--><dependency><groupId>org.apache.poi</groupId><artifactId>poi</artifactId><version>${poi.version}</version></dependency><!-- poi end--><!-- email start--><dependency><groupId>com.sun.mail</groupId><artifactId>javax.mail</artifactId><version>1.5.6</version></dependency><!-- email end--></dependencies><build><finalName>jeeplatform-admin</finalName></build>
</project>

设计好数据库，编写一个实体类：

package org.muses.jeeplatform.model.entity;import java.util.Date;
import java.util.Set;import javax.persistence.CascadeType;
import javax.persistence.Column;
import javax.persistence.Entity;
import javax.persistence.FetchType;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
import javax.persistence.JoinColumn;
import javax.persistence.JoinTable;
import javax.persistence.ManyToMany;
import javax.persistence.Table;
import javax.persistence.Temporal;
import javax.persistence.TemporalType;/*** 用户信息的实体类* @author Nicky*/
@Entity
@Table(name="sys_user")
public class User {/** 用户Id**/private int id;/** 用户名**/private String username;/** 用户密码**/private String password;/** 手机号**/private int phone;/** 性别**/private String sex;/** 邮件**/private String email;/** 备注**/private String mark;/** 用户级别**/private String rank;/** 最后一次时间**/private Date lastLogin;/** 登录ip**/private String loginIp;/** 图片路径**/private String imageUrl;/** 注册时间**/private Date regTime;/** 账号是否被锁定**/private Boolean locked = Boolean.FALSE;private Set<Role> roles;       @GeneratedValue(strategy=GenerationType.IDENTITY)@Idpublic int getId() {return id;}public void setId(int id) {this.id = id;}@Column(unique=true,length=100,nullable=false)public String getUsername() {return username;}public void setUsername(String username) {this.username = username;}@Column(length=100,nullable=false)public String getPassword() {return password;}public void setPassword(String password) {this.password = password;}public int getPhone() {return phone;}public void setPhone(int phone) {this.phone = phone;}@Column(length=6)public String getSex() {return sex;}public void setSex(String sex) {this.sex = sex;}@Column(length=100)public String getEmail() {return email;}public void setEmail(String email) {this.email = email;}@Column(length=30)public String getMark() {return mark;}public void setMark(String mark) {this.mark = mark;}@Column(length=10)public String getRank() {return rank;}public void setRank(String rank) {this.rank = rank;}@Temporal(TemporalType.DATE)public Date getLastLogin() {return lastLogin;}public void setLastLogin(Date lastLogin) {this.lastLogin = lastLogin;}@Column(length=100)public String getLoginIp() {return loginIp;}public void setLoginIp(String loginIp) {this.loginIp = loginIp;}@Column(length=100)public String getImageUrl() {return imageUrl;}public void setImageUrl(String imageUrl) {this.imageUrl = imageUrl;}@Temporal(TemporalType.DATE)@Column(nullable=false)public Date getRegTime() {return regTime;}public void setRegTime(Date regTime) {this.regTime = regTime;}public Boolean getLocked() {return locked;}public void setLocked(Boolean locked) {this.locked = locked;}}

编写接口实现Spring Data框架的PagingAndSortingRepository接口

package org.muses.jeeplatform.repository;import org.muses.jeeplatform.model.entity.User;
import org.springframework.data.domain.Page;
import org.springframework.data.domain.Pageable;
import org.springframework.data.jpa.repository.JpaRepository;
import org.springframework.data.jpa.repository.Query;
import org.springframework.data.repository.PagingAndSortingRepository;
import org.springframework.data.repository.query.Param;import java.util.Date;public interface UserRepository extends PagingAndSortingRepository<User, Integer> {/*User findByUsername(String username);@Query("from User u where u.username=:username and u.password=:password")User findByUsernameAndPassword(@Param("username") String username, @Param("password") String password);@Query("from User u where u.id=:id")User findById(@Param("id") int id);@Query("from User u where date_format(u.lastLogin,'yyyy-MM-dd') between date_format((:startDate),'yyyy-MM-dd') and date_format((:endDate),'yyyy-MM-dd')")Page<User> searchU(@Param("startDate")Date startDate,@Param("endDate")Date endDate, Pageable pageable);
*/
}

业务类实现：

package org.muses.jeeplatform.service;import java.util.*;import org.muses.jeeplatform.model.entity.User;
import org.muses.jeeplatform.repository.UserRepository;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.domain.Page;
import org.springframework.data.domain.PageRequest;
import org.springframework.data.domain.Sort;
import org.springframework.data.jpa.domain.Specification;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;import javax.persistence.criteria.CriteriaBuilder;
import javax.persistence.criteria.CriteriaQuery;/*** @description 用户信息管理的业务类* @author Nicky * @date 2017年3月6日*/
@Service
public class UserService {@AutowiredUserRepository userRepository;/*** 构建PageRequest对象* @param num* @param size* @param asc* @param string* @return*/private PageRequest buildPageRequest(int num, int size, Sort.Direction asc,String string) {return new PageRequest(num-1, size,null,string);}/*** 获取所有的菜单信息并分页显示* @param pageNo*             当前页面数* @param pageSize*            每一页面的页数* @return*/@Transactionalpublic Page<User> findAll(int pageNo, int pageSize, Sort.Direction dir, String str){PageRequest request = buildPageRequest(pageNo, pageSize, dir, str);Page<User> users = userRepository.findAll(request);return users;}
}

控制类，采用SpringMVC框架，先编写一个baseController，实现一些通用功能的封装：

package org.muses.jeeplatform.web.controller;import javax.servlet.http.HttpServletRequest;import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.web.context.request.RequestContextHolder;
import org.springframework.web.context.request.ServletRequestAttributes;
import org.springframework.web.servlet.ModelAndView;public class BaseController {Logger log = null;/*** 获取日志对象* @return*/public Logger getInstance(){if(log == null){log = LoggerFactory.getLogger(BaseController.class);}return log;}/*** 得到request对象*/public HttpServletRequest getRequest() {HttpServletRequest request = ((ServletRequestAttributes)RequestContextHolder.getRequestAttributes()).getRequest();return request;}/*** 得到ModelAndView*/public ModelAndView getModelAndView(){return new ModelAndView();}}

控制类实现：

package org.muses.jeeplatform.web.controller;import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
import net.sf.json.JsonConfig;
import org.apache.commons.collections.map.HashedMap;
import org.muses.jeeplatform.core.Constants;
import org.muses.jeeplatform.core.ExcelViewWrite;
import org.muses.jeeplatform.core.JavaEmailSender;
import org.muses.jeeplatform.model.entity.User;
import org.muses.jeeplatform.service.UserService;
import org.muses.jeeplatform.utils.DateJsonValueProcessor;
import org.muses.jeeplatform.utils.DateUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.domain.Page;
import org.springframework.data.domain.Sort;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.servlet.ModelAndView;import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.PrintWriter;
import java.util.*;/*** Created by Nicky on 2017/7/29.*/
@RequestMapping("/user")
@Controller
public class UserController extends BaseController{@AutowiredUserService userService;/*** 查询所有管理员信息并分页显示* @param request* @param response* @param model* @return*/@RequestMapping(value = "/queryAll",produces = "application/json;charset=UTF-8")@ResponseBodypublic ModelAndView findAll(HttpServletRequest request, HttpServletResponse response, Model model){//当前页String pageIndexStr = request.getParameter("pageIndex");//每一页的页数int pageSize = Constants.PAGE_SIZE;ModelAndView mv = this.getModelAndView();Page<User> userPage;if(pageIndexStr==null||"".equals(pageIndexStr)){pageIndexStr = "0";}int pageIndex = Integer.parseInt(pageIndexStr);userPage = userService.findAll(pageIndex+1, pageSize, Sort.Direction.ASC,"id");mv.addObject("totalCount",userPage.getTotalElements());mv.addObject("pageIndex",pageIndex);
//        JsonConfig cfg = new JsonConfig();
//        cfg.setExcludes(new String[]{"handler","hibernateLazyInitializer"});JsonConfig jcg = new JsonConfig();jcg.registerJsonValueProcessor(Date.class,new DateJsonValueProcessor("yyyy-mm-dd"));JSONArray jsonArray = JSONArray.fromObject(userPage.getContent(),jcg);//System.out.println(jsonArray.toString());mv.addObject("users",jsonArray.toString());mv.setViewName("admin/user/sys_user_list");return mv;}}

【前端页面实现】
页面View实现，引用 jquery.pagination.js （分页js），跟pagination.css（分页样式css）。
可以去这里下载
http://www.cnblogs.com/knowledgesea/archive/2013/01/03/2841554.html

<%@ page contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="zh-CN">
<head><base href="<%=basePath %>"><meta charset="UTF-8" /><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Insert title here</title><!-- bootstrap样式--><link type="text/css" rel="stylesheet"href="<%=basePath%>plugins/page/css/bootstrap-3.3.5.min.css" /><!-- jquery.pagination所需CSS --><link type="text/css" rel="stylesheet" href="<%=basePath%>plugins/page/css/pagination.css" /><script type="text/javascript" src="<%=basePath%>plugins/page/js/jquery.min.js"></script><!-- jquery.pagination所需JS 注意必须放在jquery.js后面 --><script type="text/javascript" src="<%=basePath%>plugins/page/js/jquery.pagination.js"></script><script type="text/javascript">/** 分页操作，使用jquery.pagination插件 add by nicky 20170729 start **///当前页var pageIndex = Number(${pageIndex});//数据量var totalCount = Number(${totalCount});$(document).ready(function () {//加入分页的绑定$("#Pagination").pagination(totalCount, {callback : pageselectCallback,prev_text : '< 上一页',next_text: '下一页 >',items_per_page : 6,num_display_entries : 6,current_page : pageIndex,num_edge_entries : 1,link_to: "user/queryAll?pageIndex=__id__"  //分页的js中会自动把"__id__"替换为当前的数。0});var html = "";var data = ${users};$.each(data,function(idx,obj){var id = obj.id;var username = obj.username;var mark = obj.mark;var phone = obj.phone;var email = obj.email;var lastLogin = obj.lastLogin;var loginIp = obj.loginIp;html += "<tr><td><input type='checkbox' name='id' id='id' value=" + id + " /></td>" +"<td>"+id+"</td>"+"<td>"+username+"</td>"+"<td>"+mark+"</td>"+"<td>"+phone+"</td>"+"<td>"+email+"</td>"+"<td>"+lastLogin+"</td>"+"<td>"+loginIp+"</td>"+"<td><a href='javascript:openEditDialog("+id+");' class='bounceIn'>配置角色</a>"+"</tr>";});$("#content").append(html);});//这个事件是在翻页时候用的function pageselectCallback(index, jq) {}/** 分页操作，使用jquery.pagination插件 add by nicky 20170729 end **///checkbox的全选/反选var isCheckAll = false;function doCheck(){if(isCheckAll){$("input[type='checkbox']").each(function(){this.checked = false;});isCheckAll = false;}else{$("input[type='checkbox']").each(function(){this.checked = true;});isCheckAll = true;}}</script>
</head>
<body>
<br>
<div class="container-fluid"><div class="row"><div class="col-xs-12 col-md-12"><div class="panel panel-default"><div class="panel-body"><form class="form-inline"><input type="button" class="btn btn-default" value="发送邮件" onclick="sendEmail();" /><input type="button" class="btn btn-default" value="发送短信" onclick="sendSms();" /><input type="button" class="btn btn-default" value="导出Excel表" onclick="exportExcel();" /><br><br><!--<input type="text" class="form-control" id="keyword" placeholder="请输入关键词">&nbsp;&nbsp;&nbsp;&nbsp;日期从<input type="text" class="form-control" placeholder="请输入开始日期" value="${startdate }" id="startDate" name="startdate" onclick="WdatePicker({dateFmt:'yyyy-MM-dd' ,maxDate:'#F{$dp.$D(\'endDate\')}'});"/>到<input type="text" class="form-control" placeholder="请输入结束日期" value="${enddate }" id="endDate" name="enddate" onclick="WdatePicker({dateFmt:'yyyy-MM-dd' ,minDate:'#F{$dp.$D(\'startDate\')}'});" />&nbsp;&nbsp;&nbsp;&nbsp;<input type="button" class="btn btn-default" value="Search" onclick="doSearch();"/>--></form><table class="table" id="mTable"><thead><tr><th><input type="checkbox" onclick="doCheck();" /></th><th>序号</th><th>用户名</th><th>描述</th><th>手机</th><th>邮箱</th><th>最近登录</th><th>上次登录IP</th><th>操作</th></tr></thead><tbody id="content"></tbody></table><div id="Pagination" class="pagination"></div><!-- demo  --></div></div></div></div>
</div>
</body>
</html>

前端页面展示：
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-LJS9RN4n-1572616478878)(https://img-blog.csdn.net/20170820214659857?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxNDQyNzM5MQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)]

ok，本博客是基于一款正在开发中的github开源项目的，项目代码地址：https://github.com/u014427391/jeeplatform
欢迎star(收藏)或者可以下载去学习，不过还在开发…

基础平台项目之集成Jquery.pagination.js实现分页相关推荐

无刷新分页 jquery.pagination.js
序言这一款js分页使用起来很爽,自己经常用,做项目时总是要翻以前的项目看,不方便,这里就把他写出来方便自己以后粘帖,也希望能分享给大家. 友情提示下:我有一片博客是用着个js实现的无刷新分页也很好用 ...
Asp.Net无刷新分页（ jquery.pagination.js）
采用Jquery无刷新分页插件jquery.pagination.js 实现无刷新分页效果友情提示:本示例Handler中采用StringBuilder的append方法追加HTML,小数据量可 ...
基础平台项目之设计方案
JEEPlatform 一款企业信息化开发基础平台,可以用于快速构建企业后台管理系统,集成了OA(办公自动化).SCM(供应链系统).ERP(企业资源管理系统).CMS(内容管理系统).CRM(客户关 ...
BootStrap使用方法为BootStrap3添加jquery.min.js文件（简单易懂）_☆往事随風☆的博客
为BootStrap3添加jquery.min.js文件一.前言二.BootStrap简介三.BootStrap3的使用方法 (1)先去官网找到BootStrap3这个版本的文档. (2)配置B ...
jQuery Pagination分页插件的使用
一.引用CSS和JS: <link href="/Content/Plugins/jQuery.Pagination_v2.2/pagination.css" rel=&qu ...
jQuery Pagination分页插件--无刷新
源码:https://github.com/SeaLee02/FunctionModule/blob/master/UploadFiles/WebDemo/FenYE/FenYeAjax.aspx 代 ...
jQuery Pagination分页插件
demo实例页面基本demo页面 Ajax demo页面参数可编辑demo页面插件简介此jQuery插件为Ajax分页插件,一次性加载,故分页切换时无刷新与延迟,如果数据量较大不建议用此方法, ...
pagination jquery最简单的分页【无刷新和刷新都通用】
参数说明参数名描述参数值 maxentries 总条目数必选参数,整数 items_per_page 每页显示的条目数 ...
jquery pager 访问 java_jquery.pager.js实现分页效果
本文实例为大家分享了jquery.pager.js实现分页的具体代码,供大家参考,具体内容如下 1.html {{maxPage}} {{title}} {{page}} var title =jQu ...

基础平台项目之集成Jquery.pagination.js实现分页

基础平台项目之集成Jquery.pagination.js实现分页相关推荐

最新文章

热门文章