欢迎来到雅狐站长网!
兔子CDN

AJAX

当前位置:主页 > 网络编程 > AJAX >

使用AJAX实现分页

时间:2021-04-27 09:29:20|栏目:AJAX|点击:

本文实例为大家分享了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> &nbsp;";
       }
   ?>
   </td>
 </tr>
 </table>

</body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持本网站。

您可能感兴趣的文章:

上一篇:解决IE下AjaxSubmit上传文件提示下载文件问题

栏    目:AJAX

下一篇:Ajax 框架之SSM整合框架实现ajax校验

本文标题:使用AJAX实现分页

本文地址:http://www.cnzzww.cn/AJAX/56499.html

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ: | 邮箱:111#qq.com(#换成@)

Copyright © 2015-2020 雅狐站长网 版权所有 苏ICP备20040415号