js实现分页

第一步：html

<div class="pagin fr" id="pagin-btm"></div>

第二步：JS （jquery的JS需要导入，下面JS跳转的路径根据具体情况跳转，如不想改变此JS，覆盖方法改下路径即可）

if (!window.SEARCH) {window.SEARCH = {}
}
SEARCH.bottom_page_html = function(e, k, j) {if (j) {this.page_num = e;e = Math.ceil(e / 2);k = Math.ceil(k / 2);var d = 2 * e - 3, g = 2 * e + 1} else {var d = e - 1, g = e + 1}if (k < 0) {return ""}var a = e - 2, b = Math.min(k, e + 2), f = "";if (b < 7) {b = Math.min(7, k)} else {a = b - 4}if (e <= 1) {f += '<span class="prev-disabled">上一页<b></b></span>'} else {f += '<a οnclick="SEARCH.page(' + d + ', true)" href="javascript:;" class="prev" title="使用方向键左键也可翻到上一页哦！">上一页<b></b></a>'}for (var h = 1; h <= k; h++) {if (h <= 2 || h >= a && h <= b) {f += h == e ? '<a href="javascript:;" class="current">' + h + "</a>" : '<a οnclick="SEARCH.page(' + (j ? 2 * h - 1 : h) + ', true)" href="javascript:;">' + h + "</a>"} else {if (h < a) {f += '<span class="text">…</span>';h = a - 1} else {if (h > b) {f += '<span class="text">…</span>';break}}}}if (e >= k) {f += '<span class="next-disabled">下一页<b></b></span>'} else {f += '<a οnclick="SEARCH.page(' + g + ', true)" href="javascript:;" class="next" title="使用方向键右键也可翻到下一页哦！">下一页<b></b></a>'}f += '<span class="page-skip"><em>  共' + k + '页    到第</em><input class="jumpto" type="text" value="' + e + '" οnkeydοwn="javascript:if(event.keyCode==13){SEARCH.page_jump2(' + k + ');return false;}"/><em>页</em><a class="btn-skipsearch" value="确定" οnclick="SEARCH.page_jump2(' + k + ')" href="javascript:;">确定</a></span>';$("#pagin-btm").html(f)
};
SEARCH.page = function(b, a) {b = parseInt(b, 10);if (b < 1) {b = 1}window.location = "/order/myOrder.html?page="+b;
};
SEARCH.page_jump2 = function(k) {var c =$("#pagin-btm .jumpto").val();if (isNaN(c)) {c = 1;}if(c>k){c=k;}window.location = "/order/myOrder.html?page="+c;
};
SEARCH.query = "";
SEARCH.bottom_page_html(${page},${ totalPage },'');

第三步：样式（本人不懂样式）

第四步：controller里提供数据和page、totalPage两个参数，下面方法供参考

/*** 跳转到我的订单页面*/@SuppressWarnings({ "static-access", "unchecked" })@RequestMapping(value="myOrder",method = RequestMethod.GET)public ModelAndView toMyOrder(@RequestParam(value="page",defaultValue="1")Integer page,@RequestParam(value="rows",defaultValue="5")Integer rows){ModelAndView mv=new ModelAndView("my-orders");//查询订单数据UserThreadLocal userThreadLocal=new UserThreadLocal();User user=userThreadLocal.get();Map<String, Object> map= this.orderService.queryOrdersByUserName(user.getUsername(),page,rows);List<Order> lists=(List<Order>) map.get("orders");mv.addObject("orders",lists);mv.addObject("page", page);// 计算总页数Integer total = (Integer) map.get("total");mv.addObject("totalPage", (total + rows - 1) / rows);return mv;}