下面是請求的例子
<!DOCTYPE html>
<html>
<head>
<title>模擬請求分頁參數</title>
</head>
<body>
<button class="js-page" data-type="pre" type="button">上100</button>
<button class="js-page" data-type="next" type="button">下100</button>
<div>
<span id="start"></span>
~
<span id="end"></span>
/
共
<span id="pageCount"></span>
</div>
</body>
<script src="jquery.min.js"></script>
<script>
$(function() {
var dataList = [ "page:1", "page: 2", "page: 3"];
var dataListNum = 0;
var pageCount = 300;
var pageSize = 100;
var start = 1;
var end = 100;
var nowCount = 0;
var pageNum = 0; //不用這個判斷數組下標
var pageParamArr = ["{}"];
var pageParamStr = "";
getData("{}");
$(".js-page").click(function() {
if( $(this).attr("data-type") === "next") {
// 到達末頁不請求了。
if(nowCount >= pageCount) {
return;
}
pageNum++;
end += 100;
start += 100;
} else {
if( start > 1) {
end -= 100;
start -= 100;
pageParamArr.splice(pageParamArr.length - 1, 1);
} else {
return;
}
}
console.log(pageParamArr.length-1);
getData( pageParamArr[pageParamArr.length-1] );
});
function getData(params) {
console.log("請求的參數=" + params);
pageParamStr += dataList[dataListNum];
dataListNum++;
// 展示和判斷分開
if( end <= pageCount) {
$("#start").text(start);
$("#end").text(end);
}
// 獲取後端返回數據的長度；
nowCount += 100;
if(nowCount < pageCount) {
pageParamArr.push(pageParamStr);
}
console.log("存儲的參數：");
console.log(pageParamArr);
}
$("#pageCount").text(pageCount);
});
</script>
</html>
