<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
ul,li{
list-style: none;
}
</style>
</head>
<body>
<!--<ul class="list">
<li></li>
</ul>-->
<table border="1" cellspacing="0" width="500">
<tr>
<th>编号</th>
<th>名称</th>
<th>时间</th>
<th>信息</th>
<th>编辑</th>
</tr>
<tbody id="tabList">
<!--<tr>
<td>1</td>
<td>summit</td>
<td>2019-03-22</td>
<td>gis</td>
<td>删除</td>
</tr>
<tr>
<td>1</td>
<td>summit</td>
<td>2019-03-22</td>
<td>gis</td>
<td>删除</td>
</tr>-->
</tbody>
</table>
<button id="sss1">1</button>
<button id="sss">2</button>
<button id="addList">添加数据</button>
<script type="text/javascript" src="js/jquery-1.9.1.js" ></script>
<script type="text/javascript">
var cacel = {}; //保存缓存数据
var page = function () {
return function (page, fn) {
// console.log(cacel[page])
// console.log(page)
if(cacel[page]){
ajaxList(cacel[page])
fn && fn();
}else {
$.ajax({
type:"get",
url:"http://127.0.0.1:3001/list",
data: {
page:page
},
success: function(data){
console.log(data);
if(data.ok){
cacel[page] = data.list;
console.log(cacel)
//console.log()
ajaxList(data.list)
fn && fn();
// $("#tabList").empty();
// var str = '';
// for(var i = 0;i<data.list.length;i++){
// str += "<tr><td>" + (i + 1) + "</td><td>" + data.list[i].name + "</td><td>" + data.list[i].time + "</td><td>" + data.list[i].info + "</td><td onclick='delet(""+data.list[i].listNo+"")'>删除</td></tr>"
// }
// $("#tabList").append(str);
}
}
});
}
}
}
var p = page();
$(function(){
p(1)
});
$("#sss").on("click", function() {
p(6)
})
$("#sss1").on("click", function() {
p(1)
})
function ajaxList(pageNo){
let data = pageNo;
//$.ajax({
// type:"get",
// url:"http://127.0.0.1:3001/list",
// data: {
// page:pageNo
// },
// async:true,
// success: function(data){
// console.log(data);
// if(data.ok){
$("#tabList").empty();
var str = '';
for(var i = 0;i<data.length;i++){
str += "<tr><td>" + (i + 1) + "</td><td>" + data[i].name + "</td><td>" + data[i].time + "</td><td>" + data[i].info + "</td><td onclick='delet(""+data[i].listNo+"")'>删除</td></tr>"
}
$("#tabList").append(str);
// }
// }
//});
}
$("#addList").click(function() {
$.ajax({
type:"get",
url:"http://127.0.0.1:3001/addList",
async:true,
success: function(data){
ajaxList();
console.log(data);
}
});
});
function delet(listNo){
$.ajax({
type:"get",
url:"http://127.0.0.1:3001/deletList",
data: {
listNo: listNo
},
async:true,
success: function(data){
if(data.ok){
ajaxList();
console.log(data);
}
}
});
// console.log(i)
}
</script>
</body>
</html>