1、js
参考:http://www.jq22.com/jquery-info5697
// 分页处理
$('.M-box3').pagination({
totalData: total, //数据总条数
showData: pageSize, //每页显示的条数
jump: true,
coping: true,
homePage: '首页',
endPage: '末页',
prevContent: '上页',
nextContent: '下页',
callback: function(api){
console.log(api.getCurrent());
$.ajax({
url:'../data/post_list_do.php?page=' + (api.getCurrent()) + '&pageSize=' + pageSize,
success:function(res){
let datas = res.pageData;
getAjaxDom(datas);
},
error:function(){}
})
}
});
function getAjaxDom(data){
let html = '';
for (var i = 0; i < data.length; i++) {
html += `
<li>
<span>${data[i]['a_id']}</span><span>${data[i]['title']}</span>
<span>${data[i]['recommend']}</span><span>${data[i]['art_status']}</span>
<span>${data[i]['author']}</span><span>${data[i]['create_time']}</span>
<span><a href="view.php?pid=${data[i]['a_id']}">查看</a></span><span><a href="">修改</a></span><span>删除</span>
</li>
`;
}
$("#postList").html(html);
}
2.html
<!-- 分页插件 -->
<div class="M-box3"></div>