原理:点击第几页就跳过多少条数据再查询
前台:
<div>
<a href="#" id="firstpage">1</a>
<a href="#" id="secondpage">2</a>
</div>
数据库数据:
前端ajax:
$("a").click(function(){
//点击按钮变色
$(this).css('background-color','blue');
$(this).siblings().css('background-color','white');
$.ajax({
url:'http://localhost:8989/limit',
data:{
number:$(this).text()
},
success(data){
console.log('分页成功');
console.log(data);
let findata="";
//把跳过n条数据然后查询到数据添加到表格中实现分页
for(let i in data){
findata+=`<tr>
<td>${data[i].proname}</td>
<td>${data[i].proprice}</td>
<td οnclick="update(this)">编辑</td>
<td οnclick="del(this)">删除</td>
</tr>`;
}
$("tbody").html(findata);
}
});
});
后台:
app.get('/limit',(req,res)=>{
//第一页跳过10*(1-1)=0条,第二页跳过10*(2-1)=10条
let skip=10*(req.query.number-1);
dao.find('product','phone',data=>{
res.send(data);
},{},{},skip,10);
})
//查询
module.exports.find=(dbname,col,callback,myobj={},mysort={},myskip=0,mylimit=0)=>{
console.log(`跳过${myskip}条`);
connect(db=>{
let dbo=db.db(dbname);
dbo.collection(col).find(myobj).sort(mysort).skip(myskip).limit(mylimit).toArray((err,result)=>{
if(err) throw err;
console.log("数据查询成功");
db.close();
callback(result);
});
});
}
实现效果:
点击第二页查询到11~15条数据
点击第一页查询到第1~10条数据