jquery ajax分页写法
我用的是laypage插件
前端代码
<pre>
function demo(curr) {
$.getJSON('/home/index/getinfo', {
page: curr || 1 //向服务端传的参数,此处只是演示
}, function (res) {
var html = '';
var list = res.data.list;
$.each(list, function (k, v) {
html += '<div';
if(k%2==0){
html += ' style="margin-left:0px;"';
}
html += ' class="perinfocontent" onclick="window.location.href=\'content.html?id='+v['id']+'\'">';
html += '<img src="'+v['fengmiantu']+'" alt="" class="pic">';
html += '<div class="infos">';
html += '<div class="title">'+v['title']+'</div>';
html += '<div class="tiyao">'+v['content']+'</div>';
html += '<div class="publishtime">2017 / 1 / 23</div>';
html += '</div>';
html += '</div>';
});
$('.infocontent').html(html);
//显示分页
laypage({
cont: $('#page3'), //容器。值支持id名、原生dom对象,jquery对象,
pages: res.data.pagecount, //总页数
skip: true, //是否开启跳页
skin: 'molv',
curr: curr || 1, //当前页
jump: function (obj, first) { //触发分页后的回调
if (!first) { //点击跳页触发函数自身,并传递当前页:obj.curr
demo(obj.curr);
}
}
});
});
};
//运行
demo();
</pre>
PHP代码
<pre>
public function getinfo(){
$page = intval($_GET['page']);
if(empty($page)){
$page=1;
}
$startpos=$page-1;
//返回每页的数据
$percount = 8;
$VModel = new HuanShanVoteModel();
$sql = 'select * from wz_content order by id desc limit '.$startpos*$percount.',' . $percount;
$result = $VModel->query($sql);
foreach ($result as $k => $v) {
$result[$k]['content'] = substr(stripHTML(htmlspecialchars_decode($v['content'])), 0, 30) . '......';
$result[$k]['time'] = date('Y / M / D', $v['time']);
}
//返回总页码数
$VModel = new HuanShanVoteModel();
$sql = 'select title,content from wz_content';
$alllist = $VModel->query($sql);
$count = count($alllist);
$pagecount = ceil($count / $percount);
echo json_encode(array('success'=>1,'msg'=>'查询成功','data' => array('pagecount' => $pagecount, 'list' => $result)));
exit();
}
</pre>