ajax完美实现两个网页 分页功能的实例代码


Posted in PHP onApril 16, 2013

分页的首页

<meta http-equiv="Content-Type" content="text/html; charset=utf8" />
<h1 align="center">武侠小说分页</h>
<br/>
<script src="jquery-1.4.2.min.js"></script>
<script>
var page='';
  function init(page){
  document.getElementById("tables").innerHTML='';
   var xhr;
   if(window.XMLHttpRequest){
 xhr = new XMLHttpRequest();
}else if(window.ActiveXObject){
 xhr =new ActiveXObject("Microsoft.XMLHTTP")
}
var url="fenye.php";
 xhr.open("POST",url,true);
 xhr.onreadystatechange=callback;
 xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
 if(page){
 xhr.send("page="+page);
 }
 else {xhr.send("page=1");}
 var content;
 function callback(){
   if(xhr.readyState==4){
     if(xhr.status==200){
      var json =eval('('+xhr.responseText+')');
   //alert(xhr.responseText);
  var fenye=json.str;
 //  alert(fenye);
     document.getElementById('div').innerHTML=fenye;
  content="<th>ID</th><th>名称</th><th>作者</th><th>出版社</th><th>ISBN号</th><th>类型</th><th>价格</th>";
  for(var i=0;i<json.info.length;i++){
  content+="<tr><td>"+json.info[i].id+"</td><td>"+json.info[i].name+"</td><td>"+json.info[i].author+"</td><td>"+json.info[i].publisher+"</td><td>"+json.info[i].isbn+"</td><td>"+json.info[i].type+"</td><td>"+json.info[i].price+"</tr>";
  document.getElementById("tables").innerHTML=content;
  }
    // alert(fenye);
     }
   }
   }
 }</script>


<body onLoad="init()">
 <h3 align="center">jquery实现$.ajax的分页</h3>
<table id="tables" style=" width:500px; height:100px; text-align:center" align="center" border="5" bordercolor="#FF6600">
<th>ID</th><th>名称</th><th>作者</th><th>出版社</th><th>ISBN号</th><th>类型</th><th>价格</th>
</table>
<table align="center" style="margin-top:15px">
 <tr><td>
 <td style="colspan:3;height:20">
 <div id="div" style="position:absolute; left: 447px; top: 218px; width: 411px; height: 22px;"></div>
 </td>
</tr>
</table>
<br />
</body>

 

分页的php精华代码

<?php
    //命令模型层处理数据
  $link=mysql_connect('localhost','root','') or die("失败");
  mysql_select_db('books',$link) or die("连接数据库出错了!");
  //每页显示记录数
  $pagesize = 2;
  //求出总的记录数
  $sql = "select count(*) as total_rows from books";
  $result = mysql_query($sql);
  $total_rows = mysql_fetch_array($result);
  //求总共的页码数
  $pages = ceil($total_rows[0]/$pagesize);
  //当前第几页
  $page = $_POST['page'];
  $strtext = "当前第".$page."页"."总共".$pages."页"."共".$total_rows[0]."记录";
  //var_dump($str);
  //接下来,我要根据当前点击的页码求出对应的数据
  $offset = $pagesize*($page-1);
  $sql = "select * from books limit $offset,$pagesize";
  mysql_query("set names utf8");
        $res=mysql_query($sql);   $rows=array();
  while($row=mysql_fetch_assoc($res)){
    $rows[]=$row;
   }
  $pageInfo = $rows;
  //echo json_encode($pageInfo);
  //var_dump($pageInfo);
  //将获得数据链接,后返回
  $first=1;
  $prev=$page-1;
  $next=$page+1;
  $last=$pages;
  //命令视图层显示数据
      $first_a = "<a onclick='init(".$first.")' href='#'><img src='3.jpg' width='50px;' height='20px;'/></a>";
  if($page>1){
   $prev_a = "<a onclick='init(".$prev.")' href='#'><img src='1.jpg' width='50px;' height='20px;'/></a>";
  }
  if($page<$pages){
   $next_a = "<a onclick='init(".$next.")' href='#'><img src='2.jpg' width='50px;' height='20px;'/></a>";
  }
  $last_a = "<a onclick='init(".$last.")' href='#'><img src='4.jpg' width='50px;' height='20px;'/></a>";
  @$str = $strtext.$first_a.$prev_a.$next_a.$last_a;
  //var_dump($str);
  $info = array('str'=>$str,'info'=>$pageInfo);
  echo json_encode($info);
PHP 相关文章推荐
用文本文件实现的动态实时发布新闻的程序
Oct 09 PHP
window+nginx+php环境配置 附配置搭配说明
Dec 29 PHP
PHP开发不能违背的安全规则 过滤用户输入
May 01 PHP
解决PHP mysql_query执行超时(Fatal error: Maximum execution time …)
Jul 03 PHP
PHP 实现判断用户是否手机访问
Jan 21 PHP
PHP的Yii框架中Model模型的学习教程
Mar 29 PHP
PHP制作登录异常ip检测功能的实例代码
Nov 16 PHP
老生常谈PHP 文件写入和读取(必看篇)
May 22 PHP
PHP迭代器接口Iterator用法分析
Dec 28 PHP
php简单计算权重的方法示例【适合抽奖类应用】
Jun 10 PHP
Laravel统计一段时间间隔的数据方法
Oct 09 PHP
Laravel获取当前请求的控制器和方法以及中间件的例子
Oct 11 PHP
关于Iframe如何跨域访问Cookie和Session的解决方法
Apr 15 #PHP
关于PHP的相似度计算函数:levenshtein的使用介绍
Apr 15 #PHP
关于PHP递归算法和应用方法介绍
Apr 15 #PHP
PHP 读取Postgresql中的数组
Apr 14 #PHP
php简单开启gzip压缩方法(zlib.output_compression)
Apr 13 #PHP
做了CDN获取用户真实IP的函数代码(PHP与Asp设置方式)
Apr 13 #PHP
php检测图片木马多进制编程实践
Apr 11 #PHP
You might like
php设计模式 Prototype (原型模式)代码
2011/06/26 PHP
php支付宝手机网页支付类实例
2015/03/04 PHP
实例讲解yii2.0在php命令行中运行的步骤
2015/12/01 PHP
PHP SFTP实现上传下载功能
2017/07/26 PHP
学习ExtJS border布局
2009/10/08 Javascript
Extjs优化(一)删除冗余代码提高运行速度
2013/04/15 Javascript
jQuery的3种请求方式$.post,$.get,$.getJSON
2014/03/28 Javascript
javascript解三阶幻方(九宫格)
2015/04/22 Javascript
学习JavaScript设计模式(继承)
2015/11/26 Javascript
分享12个非常实用的JavaScript小技巧
2016/05/11 Javascript
JavaScript toUpperCase()方法使用详解
2016/08/26 Javascript
VueJS 集成 Medium Editor的示例代码 (自定义编辑器按钮)
2017/08/24 Javascript
利用vue和element-ui设置表格内容分页的实例
2018/03/02 Javascript
Vue代码整洁之去重方法整理
2019/08/06 Javascript
解决mui框架中switch开关通过js控制开或者关状态时小圆点不动的问题
2019/09/03 Javascript
Vue通过Blob对象实现导出Excel功能示例代码
2020/07/31 Javascript
vue 实现一个简单的全局调用弹窗案例
2020/09/10 Javascript
python bottle框架支持jquery ajax的RESTful风格的PUT和DELETE方法
2017/05/24 Python
解决nohup重定向python输出到文件不成功的问题
2018/05/11 Python
VSCode Python开发环境配置的详细步骤
2019/02/22 Python
Pandas的read_csv函数参数分析详解
2019/07/02 Python
Django中使用极验Geetest滑动验证码过程解析
2019/07/31 Python
python实现复制大量文件功能
2019/08/31 Python
通过python调用adb命令对App进行性能测试方式
2020/04/23 Python
基于python实现坦克大战游戏
2020/10/27 Python
Sunglasses Shop丹麦:欧洲第一的太阳镜在线销售网站
2017/10/22 全球购物
Under Armour安德玛中国官网:美国高端运动科技品牌
2018/03/09 全球购物
Kate Spade澳大利亚官方网站:美国设计师手袋品牌
2019/09/10 全球购物
JDBC操作数据库的基本流程是什么
2014/10/28 面试题
成品仓管员岗位职责
2013/12/11 职场文书
买房子个人收入证明
2014/01/16 职场文书
习近平在党的群众路线教育实践活动总结大会上的讲话
2014/10/21 职场文书
教师学期末个人总结
2015/02/13 职场文书
党小组考察意见
2015/06/02 职场文书
队列队形口号
2015/12/25 职场文书
导游词之蜀山胜景瓦屋山
2019/11/29 职场文书