生活随笔
收集整理的這篇文章主要介紹了
app端分页 简单的分页 java
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
大家好：
????? 今天遇到一個問題自己整了一下午，好不容易整理出來，跟大家一起分享一下！樣式如下：
JSP頁面 其中
<span style="font-size:14px;"><%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<%@ include file="/view/common/tags.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /><link rel="stylesheet" href="<%=request.getContextPath()%>/css/base.css" type="text/css"/>?? ?
<title>交易記錄</title>
</head>
<body>
<input type="hidden" id="currentPage" name="currentPage" value="0" /><div class="container"><ul class="record_tab"><li class="current" οnclick="clickMother(30)">近一個月</li><li οnclick="clickMother(90)">近三個月</li><li οnclick="clickMother(0)">全部</li></ul><div class="panes"></div>
</div>
<script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery-1.11.1.min.js"></script>
<script type="text/javascript">$(function(){?? ?$('.record_tab li').click(function(){?? ??? ?$(this).addClass('current').siblings().removeClass('current');$('.panes>div:eq('+$(this).index()+')').show().siblings().hide();?? ?})});
//頁面加載事件
window.οnlοad=function() //用window的onload事件，窗體加載完畢的時候
{var startDate = dates(30);?? ?//開始時間?? //調(diào)dates方法，var nowDate = new Date(); ?? ?//當前時間 nowDate.setDate(nowDate.getDate());var endDate = nowDate.getFullYear() + '-' + (nowDate.getMonth()+1) + '-' + nowDate.getDate() + ' ' + nowDate.getHours() + ':' + nowDate.getMinutes() + ':' + nowDate.getSeconds();var cardno ="<%=request.getParameter("cardNo")%>";??? //卡號var _path = "<%=request.getContextPath()%>";viewPage(cardno,startDate,endDate,_path);
}
//分頁顯示
var finished = true;
function viewPage(cardno,startDate,endDate,_path) {transaction(cardno,startDate,endDate,_path);$(window).scroll(function(){if($(document).scrollTop()>=$(document).height()-$(window).height() && finished){finished = false;var currentPage = $("#currentPage").val(); $("#currentPage").val(parseInt(currentPage)+1);$.ajax({type:"POST",url:_path + "/mobile/cardManager/transactionRecords?cardno="+cardno+"&startDate="+startDate+"&endDate="+endDate+"¤tPage="+$("#currentPage").val(),dataType:'json',cache : false,beforeSend:function(){},success:function(data){finished = true;if(data=='' || data==null){$("#currentPage").val(parseInt(currentPage)-1);finished = false;}if(data.length!=0){ ?? ??? ??? ??? ?//存在數(shù)據(jù)時，拼接數(shù)據(jù) for(var i=0;i<data.length;i++){ ?? ?//循環(huán)數(shù)據(jù)，配節(jié)頁面$(".panes").append( "<div class='pane' style='display:block;'>"+"<div class='three_months'> "+"<div class='three_months_fl fl'>"+"<p class='expense_type'>"+data[i].tradeType+"</p>"+"<p class='hospital_name'>"+data[i].tradePlace+"</p>"+"<p class='payment_date'>"+data[i].tradeTime+"</p>"+"</div>"+"<div class='three_months_fr fr'>?? ?"+"<p class='price price_red'>"+data[i].amount+"元</p>"+"</div>"+"</div>"+"</div>");}}else{ ??? ??? ??? ??? ??? ??? ??? ?//無任何數(shù)據(jù)
//?????????????? ??? ??? ??? ??? ? $(".panes").append( "<div class='pane' style='display:block;'>"+
//?????????????? ??? ??? ??? ??? ??? ??? ?"<p>無任何數(shù)據(jù)</p>"+
//?????????????? ??? ??? ??? ??? ??? ??? ?"</div>");}if(data.length<5){finished = false;}}})}}); }//月份點擊
function clickMother(day){var startDate1 ;var endDate1;var cardno1;var _path1;if(day!=0){startDate1 = dates(day);?? ?//開始時間?? //調(diào)dates方法，var nowDate1 = new Date(); ?? ?//當前時間 nowDate1.setDate(nowDate1.getDate());endDate1 = nowDate1.getFullYear() + '-' + (nowDate1.getMonth()+1) + '-' + nowDate1.getDate() + ' ' + nowDate1.getHours() + ':' + nowDate1.getMinutes() + ':' + nowDate1.getSeconds();cardno1 ="<%=request.getParameter("cardNo")%>";??? //卡號_path1 = "<%=request.getContextPath()%>";finished = true;viewPage(cardno1,startDate1,endDate1,_path1);}else{startDate1 = '1970-1-1 00:00:00 ';?? ?//開始時間? ?var nowDate1 = new Date(); ?? ?//當前時間 nowDate1.setDate(nowDate1.getDate());endDate1 = nowDate1.getFullYear() + '-' + (nowDate1.getMonth()+1) + '-' + nowDate1.getDate() + ' ' + nowDate1.getHours() + ':' + nowDate1.getMinutes() + ':' + nowDate1.getSeconds();cardno1 ="<%=request.getParameter("cardNo")%>";??? //卡號_path1 = "<%=request.getContextPath()%>";finished = true;viewPage(cardno1,startDate1,endDate1,_path1);}
}//發(fā)送請求，拼接頁面
function transaction(cardno,startDate,endDate,_path){$("#currentPage").hide();//沒辦法 Different phone are not the samevar currentPage = $("#currentPage").val(); //當前頁$("#currentPage").val(1);if(currentPage==""||currentPage==0){$("#currentPage").val("1");}currentPage = $("#currentPage").val();$(".panes").empty(); //清空之前的數(shù)據(jù)$.post( _path + "/mobile/cardManager/transactionRecords",{"cardno" : cardno,"startDate" : startDate,"endDate" : endDate,"currentPage" : currentPage,},function(data) {if(data.length!=0){ //存在數(shù)據(jù)時，拼接數(shù)據(jù) for(var i=0;i<data.length;i++){ //循環(huán)數(shù)據(jù)，配節(jié)頁面$(".panes").append( "<div class='pane' style='display:block;'>"+"<div class='three_months'> "+"<div class='three_months_fl fl'>"+"<p class='expense_type'>"+data[i].tradeType+"</p>"+"<p class='hospital_name'>"+data[i].tradePlace+"</p>"+"<p class='payment_date'>"+data[i].tradeTime+"</p>"+"</div>"+"<div class='three_months_fr fr'>?? ?"+"<p class='price price_red'>"+data[i].amount+"元</p>"+"</div>"+"</div>"+"</div>");}}else{//無任何數(shù)據(jù)$(".panes").append( "<div class='pane' style='display:block;'>"+"<p>無任何數(shù)據(jù)</p>"+"</div>");}});
}//近一個月的時間（包含當天 共 30天）
function dates(tian) {var newDate = new Date();newDate.setDate(newDate.getDate() - (tian-1));var date = newDate.getFullYear() + '-' + (newDate.getMonth()+1) + '-' + newDate.getDate() + ' ' + newDate.getHours() + ':' + newDate.getMinutes() + ':' + newDate.getSeconds();return date;
}
//近一個月的時間（不包含當天?? 共30天）
/* function dates(tian) {var newDate = new Date();newDate.setDate(newDate.getDate() - tian);var date = newDate.getFullYear() + '-' + (newDate.getMonth() + 1) + '-' + newDate.getDate() + ' ' + newDate.getHours() + ':' + newDate.getMinutes() + ':' + newDate.getSeconds();return date;
} */</script>
</body>
</html>
</span>
Controller 方法：
@RequestMapping(value = "/transactionRecords", method = RequestMethod.POST)@ResponseBodypublic Object transactionRecords(@RequestParam(value = "cardno", required = true) String cardno //京醫(yī)通卡號,@RequestParam(value = "startDate", required = true) String startDate //開始時間,@RequestParam(value = "endDate", required = true) String endDate //結束時間,@RequestParam(value = "currentPage", required = false) String currentPage //當前頁數(shù)的起始條數(shù)){CardInfo cardInfo = new CardInfo();String inputType = "5"; //操作類型 5.交易記錄查詢cardInfo.setCardno(cardno); //卡號List<TradeRecords> tradeRecordsList = null;try {//分頁參數(shù)Integer pageSize =5;Integer curPage =(Integer.parseInt(currentPage)-1)*pageSize;Map<String, Object> pageInfo = new HashMap<String,Object>();pageInfo.put("curPage", curPage); //當前頁數(shù)的起始條數(shù)pageInfo.put("pageSize", pageSize); //每頁多少條tradeRecordsList = cardManageInf.queryTradeRecords(cardInfo, inputType, startDate, endDate, pageInfo); //根據(jù)京醫(yī)通卡號，查詢交易記錄} catch (Exception e) {e.printStackTrace();logger.error("接口調(diào)用異常！");}return tradeRecordsList;}
Service 分頁方法
@Overridepublic List<TradeRecords> queryTradeRecords(CardInfo cardInfo,String inputType,String startDate, String endDate,Map<String, Object> pageInfo) throws Exception {List<TradeRecords> tradeRecordsList = new ArrayList<TradeRecords>(); //所有數(shù)據(jù)List<TradeRecords> tradeRecordsList1 = new ArrayList<TradeRecords>(); //當前頁數(shù)據(jù)for (int i = 0; i < 8; i++) {TradeRecords tradeRecords = new TradeRecords();tradeRecords.setTradeNo("abc000001"+String.valueOf(i));tradeRecords.setTradeType("交易類型"+String.valueOf(i));tradeRecords.setTradeTime("2015-01-03");tradeRecords.setTradePlace("協(xié)和醫(yī)院");tradeRecords.setClientType("正常繳費");tradeRecords.setAmount(100d);tradeRecordsList.add(tradeRecords);}int curPage = (int) pageInfo.get("curPage"); //當前條數(shù)從哪里開始取int offset = tradeRecordsList.size()-curPage;//還有多少沒有取過int pageSize = (int) pageInfo.get("pageSize"); //每頁顯示的記錄數(shù)int pageCount = offset>pageSize?pageSize : offset;//如果沒有取過的大于需要顯示的數(shù)，則實現(xiàn)顯示數(shù)pageCount=pageItems,反之然；即剩余數(shù)大于顯示條數(shù)，則顯示五條，否則顯示剩余條數(shù)for(int i=curPage;i<tradeRecordsList.size();i++){tradeRecordsList1.add(tradeRecordsList.get(i));if(tradeRecordsList1.size() == pageCount){break;}}return tradeRecordsList1;}
總結
以上是生活随笔為你收集整理的app端分页 简单的分页 java的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。
