<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>ajax分页</title> </head> <body> <a href="#" οnclick="s()">上一页</a> <a href="#" οnclick="x()">下一页</a> <div class=""> <table id="tb"> </table> </div> <!--记录当前页码数 --> <input type="hidden" value="1" id="h"> </body> <script type="text/javascript" src="ajax.js"></script> <script> function ajax(url){ $.get(url,function(msg){ //后去数据后,更新当前页码 $('h').value = msg.p; $('tb').innerHTML = '<tr><td>姓名</td><td>年龄</td><td>性别</td></tr>' for(var i=0;i<3;i++){ var h = '<tr>'; h+='<td>'+msg[i].name+'</td>'; h+='<td>'+msg[i].age+'</td>'; h+='<td>'+msg[i].sex+'</td>'; h += '</tr>'; $('tb').innerHTML += h; } },'json'); } //初始化页面获取数据 window.onload = function (){ ajax('09-7page.php?page=1'); } //上一页数据获取 function s(){ //获取当前页,计算出上一页的页码数 var p = parseInt($('h').value); //调用ajax发送请求 ajax('09-7page.php?page='+(p-1)); } //下一页数据获取 function x(){ //获取当前页,计算出下一页的页码数 var p = parseInt($('h').value); //调用ajax发送请求 ajax('09-7page.php?page='+(p+1)); } </script> </html> 后台代码: <?php mysql_connect('localhost','root',''); mysql_query('use test'); mysql_query('set names utf8'); //获取总条数 $sql = 'select count(*) as num from test'; $res = mysql_query($sql); $row = mysql_fetch_assoc($res); $count = $row['num']; $psize = 3; //设置定义 每页条数 $pcunt = ceil($count/$psize);//计算总页数 //获取页码书,就是第几页的数据 $p = $_GET['page']; if($p<1){ $p=1; } if($p>=$pcunt){ $p=$pcunt; } //每页数据从哪(第几条)开始获取 获取多少条数据 $l = ($p-1)*$psize; $sql = "select * from test limit $l,$psize"; // echo $sql; //获取指定数据,生成数组 $res = mysql_query($sql); $data = []; while($row = mysql_fetch_assoc($res)){ $data[] = $row; } $data['p'] = $p; //将当前页码数返回给前台 echo json_encode($data); //生成json字符串并返回
Ajax+PHP实现无刷新分页效果
最新推荐文章于 2021-09-27 10:48:45 发布