小编给大家分享一下怎么使用AJAX实现分页，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！
Fenye.html
<!DOCTYPE html>
<html>
<head>
<title>分页</title>
</head>
<script type="text/javascript">
/**
* AJAX
* 1.创建ajax对象
* 2.建立连接
* 3.判断ajax准备状态及状态码
* 4.发送请求
*/
function showList(pageNow){
//创建ajax对象
var xmlHttp = new XMLHttpRequest();
//建立连接
xmlHttp.open('get','./AJAX_Fenye.php?pageNow='+pageNow);
//判断ajax准备状态及状态码
xmlHttp.onreadystatechange = function(){
if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
//alert(xmlHttp.readyState);
document.getElementById('result').innerHTML = xmlHttp.responseText;
}
}
//发送请求
xmlHttp.send(null);
}
//默认显示第1页
window.onload = function(){
showList(1);
}
</script>
<body>
<input type="text">
<div id="result">
<!-- 此处显示信息！ -->
</div>
</body>
</html>Fenye.php
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>AJAX分页</title> </head> <body> <?php //以下php代码可封装调用，参数为pageNow //链接数据库 @mysql_connect('localhost','root',''); @mysql_select_db('empmanage'); @mysql_query('set name utf8'); //获取总记录数 $rs = mysql_query('select count(*) from emp'); $rows = mysql_fetch_row($rs); $recordCount = $rows[0]; //每页显示多少条pageSize $pageSize = 5; //总页数 = 总记录/每页显示多少 $pageCount=ceil($recordCount/$pageSize); //获取当前页 三元运算 若不存在pageNow则默认显示第1页 $pageNow = isset($_GET['pageNow'])? $_GET['pageNow']:1; if ($pageNow < 1) { $pageNow = 1; }elseif ($pageNow > $pageCount) { $pageNow = $pageCount; } //起始位置 每页从第几条数据显示 $pageStart = ($pageNow-1)*$pageSize; //从哪条开始显示，限制每页显示几条 $sql = "select * from emp limit $pageStart,$pageSize"; //链接数据库 $rs = mysql_query($sql); //以上php代码可封装调用，参数为pageNow 返回查询到的数据$rs ?> <table bordercolor="green" border="1"> <tr> <th>ID</th> <th>姓名</th> <th>邮箱</th> <th>等级</th> </tr> <?php //循环取出数据 while ($rows = mysql_fetch_assoc($rs)) { echo " <tr> <td>{$rows['id']}</td> <td>{$rows['name']}</td> <td>{$rows['email']}</td> <td>{$rows['level']}</td> </tr> "; } ?> <tr> <td colspan='4'> <?php //分页页码 调用js中的showList()方法 此处$i=$pageNow for ($i=1; $i <= $pageCount; $i++) { echo "<a href = 'javascript:void(0)' onclick = 'showList($i)'>{$i}</a> "; } ?> </td> </tr> </table> </body> </html>
ajax是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术，可以通过在后台与服务器进行少量数据交换，使网页实现异步更新。
以上是“怎么使用AJAX实现分页”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注亿速云行业资讯频道！
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
