PHP + jQuery 写简单的分页

最新推荐文章于 2021-04-06 18:40:29 发布

wake0_0

最新推荐文章于 2021-04-06 18:40:29 发布

阅读量277

点赞数

分类专栏： php jquery 文章标签：分页

本文链接：https://blog.csdn.net/wake0_0/article/details/79627745

版权

php 同时被 2 个专栏收录

11 篇文章 0 订阅

订阅专栏

jquery

2 篇文章 0 订阅

订阅专栏

HTML 页面：

<!DOCTYPE html>
<html>
<head>
<title>jquery ajax分页</title>
</head>
<body>
<div>
<p>下面是获取的内容</p>
<ul id="data">

</ul>
</div>
<div id="page">
<a href="javascript:void(0)" name="first">首页</a>
<a href="javascript:void(0)" name="up">上一页</a>
<a href="javascript:void(0)" name="next">下一页</a>
<a href="javascript:void(0)" name="last">尾页</a>
</div>
<div>
<input type="text" id="p" value="1">
<input type="text" id="pageLast" value="">
</div>

</body>
</html>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.12.4.js"></script>

<script type="text/javascript">

$(function(){//页面加载显示当前页的内容
var p = $("#p").val();//获取当前页
ajax(p); //调用ajax方法
})

$('#page>a').click(function(){//页码的点击事件
var name = $(this);
//获取pagenow当前页和总页数pagelast，记得使用parseInt，转换整型
var pn = parseInt($("#p").val());
var pl = parseInt($("#pageLast").val());
switch(name.attr('name')){ //根据a标签内的name属性判断跳转方向
case "first": p = 1;break;
case "up": p = pn-1;break;
case "next": p = pn+1;break;
case "last": p = pl;break;
}
if (p<1 || p>pl) {
return;
}else{
ajax(p);
}
})

function ajax(p){//ajax方法，与后台交互
$.ajax({
type:"post",
datatype:"json",
url:"tb.php",
data:{p:p},
success:function(msg){
$('#data').empty();
aa = $.parseJSON(msg); //转换json格式（在返回值有小的问题的时候可以使用）
pageNow = parseInt(aa[0].page);
pn = $("#p").val(pageNow);//赋值当前页
pageLast = parseInt(aa[0].lastpage);
pl = $("#pageLast").val(pageLast);//赋值总页数
$.each(aa,function(k,v){//标签内追加内容
$('#data').append('<li>id为：'+v.tb_id+';名称为：'+v.name+'</li>')
})

}
})
}

</script>

后台PHP代码：

<?php
$pdo = new PDO("mysql:host=127.0.0.1;dbname=school",'root','root');
$sql = "select * from tb";
$count = $pdo->query($sql)->rowCount();//当前数据总条数
$p = isset($_POST['p'])?$_POST['p']:1;//页码
$dataPerpage = 5;//每页显示条数
$offset = ($p-1)*$dataPerpage;//偏移量
$last = ceil($count/$dataPerpage);//总页数
$sql2 = "select * from tb limit $offset,$dataPerpage";
$data = $pdo->query($sql2)->fetchAll(PDO::FETCH_ASSOC);
//把当前页和总页数发送给前台
$data[0]['page'] = $p;
$data[0]['lastpage'] = $last;
echo json_encode($data);