php+ajax实现无刷新数据分页的办法


Posted in PHP onNovember 02, 2015

本文实例讲述了php+ajax实现无刷新分页的方法。分享给大家供大家参考。具体实现方法如下:

index.php 文件,代码如下:

<?php 
header("Content-type: text/html;charset=GBK");//输出编码,避免中文乱码 
?> 
<html> 
<head> 
<title>ajax分页演示</title> 
<script language="javascript" src="ajaxpg.js"></script> 
<link rel="stylesheet" type="text/css" href="page.css"> 
</head> 
<body> 
<div id="result"> 
<?php 
$page=isset($_GET['page'])?intval($_GET['page']):1; //这句就是获取page=18中的page的值,假如不存在page,那么页数就是1。 
$num=3; //每页显示10条数据 
 
$db=mysql_connect("localhost","root","123456"); //创建数据库连接 
mysql_select_db("demo",$db) or die("数据库链接错误"); //选择要操作的数据库 
mysql_query("set names gbk"); 
/* 
首先咱们要获取数据库中到底有多少数据,才能判断具体要分多少页,具体的公式就是 
总数据库除以每页显示的条数,有余进一。 
也就是说10/3=3.3333=4 有余数就要进一。 
*/ 
 
$result=mysql_query("select * from brand"); 
$total=mysql_num_rows($result); //查询所有的数据 
 
$url='test.php';//设置ajax提交页面地址的URL,这里设置成test.php通过ajax把参数传递给test.php再把处理过的内容赋值到本页的div id=result。 
//页码计算 
$pagenum=ceil($total/$num);//获得总页数,也是最后一页 
$page=min($pagenum,$page);//获得首页 
$prepg=$page-1;//上一页 
$nextpg=($page==$pagenum ? 0 : $page+1);//下一页 
$offset=($page-1)*$num; //获取limit的第一个参数的值,假如第一页则为(1-1)*10=0,第二页为(2-1)*10=10。 
$pagenav="<ul>"; 
 
//开始分页导航条代码: 
$pagenav.="<li>显示第 <B>".($total?($offset+1):0)."</B>-<B>".min($offset+10,$total)."</B> 条记录</li><li>共 $total 条记录 </li>"; 
 
//如果只有一页则跳出函数: 
if($pagenum<=1) return false; 
 
$pagenav.="<li> <a href=javascript:dopage('result','$url?page=1');>首页</a></li> "; 
if($prepg) $pagenav.="<li> <a href=javascript:dopage('result','$url?page=$prepg');>前页</a></li> "; else $pagenav.=" <li>前页</li> "; 
if($nextpg) $pagenav.="<li><a href=javascript:dopage('result','$url?page=$nextpg');>后页</a> </li>"; else $pagenav.=" <li>后页</li> "; 
$pagenav.="<li> <a href=javascript:dopage('result','$url?page=$pagenum');>尾页</a></li> "; 
$pagenav.="<li>第 $page 页</li><li>共 $pagenum 页</li></ul>"; 
 
//假如传入的页数参数大于总页数,则显示错误信息 
If($page>$pagenum){ 
 Echo "Error : Can Not Found The page ".$page; 
 Exit; //开源软件:phpfensi.com 
} 
?></div><div id="results"> 
<?php 
 echo $pagenav;//输出分页导航 
?> 
</div> 
</body> 
</html>

css代码:

/* CSS Document */ 
/* CSS Document */ 
#result ul li{ 
height:20px; 
width:auto; 
display:block; 
color:#999; 
border:1px solid #999; 
float:left; 
list-style:none; 
font-size:12px; 
margin-left:5px; 
line-height:20px; 
vertical-align:middle; 
text-align:center; 
} 
#result ul li a:link{ 
width:50px; 
height:20px; 
display:block; 
line-height:20px; 
background:#09C; 
border:1px solid #fff; 
color:#fff; 
text-decoration:none; 
} 
#result ul li a:hover{ 
width:50px; 
height:20px; 
display:block; 
line-height:20px; 
background:#09C; 
border:1px solid #fff; 
color:#F60; 
text-decoration:none; 
}

ajaxpg.js文件,如下:

// JavaScript Document 
var http_request=false; 
 function send_request(url){//初始化,指定处理函数,发送请求的函数 
 http_request=false; 
//开始初始化XMLHttpRequest对象 
if(window.XMLHttpRequest){//Mozilla浏览器 
http_request=new XMLHttpRequest(); 
if(http_request.overrideMimeType){//设置MIME类别 
 http_request.overrideMimeType("text/xml"); 
} 
} 
else if(window.ActiveXObject){//IE浏览器 
try{ 
 http_request=new ActiveXObject("Msxml2.XMLHttp"); 
}catch(e){ 
 try{ 
 http_request=new ActiveXobject("Microsoft.XMLHttp"); 
 }catch(e){} 
} 
 } 
if(!http_request){//异常,创建对象实例失败 
window.alert("创建XMLHttp对象失败!"); 
return false; 
} 
http_request.onreadystatechange=processrequest; 
//确定发送请求方式,URL,及是否同步执行下段代码 
 http_request.open("GET",url,true); 
http_request.send(null); 
 } 
 //处理返回信息的函数 
 function processrequest(){ 
if(http_request.readyState==4){//判断对象状态 
 if(http_request.status==200){//信息已成功返回,开始处理信息 
 document.getElementById("results").style.display="none"; 
 document.getElementById(reobj).innerHTML=http_request.responseText; 
} 
else{//页面不正常 
 alert("您所请求的页面不正常!"); 
} 
} 
 } 
 function dopage(obj,url){ 
document.getElementById(obj).innerHTML="<font color='green' font-size='12'>正在读取数据...</font>"; 
send_request(url); 
reobj=obj; 
}

数据库文件,如下:

-- phpMyAdmin SQL Dump 
-- version 2.8.1 
-- 主机: localhost 
-- 服务器版本: 5.0.22 
-- PHP 版本: 5.2.12 
-- 
-- 数据库: `demo` 
-- 
-- -------------------------------------------------------- 
-- 
-- 表的结构 `brand` 
-- 
CREATE TABLE `brand` ( 
 `id` int(7) NOT NULL auto_increment, 
 `sp_brand` varchar(255) default NULL, 
 PRIMARY KEY (`id`) 
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=19 ; 
-- 
-- 导出表中的数据 `brand` 
-- 
INSERT INTO `brand` (`id`, `sp_brand`) VALUES (1, 'hello world'), 
(2, '你好'), 
(3, '恩'), 
(4, 'fdsafdsafdsa'), 
(5, 'fdsafdafdsafdas'), 
(6, 'fdsafdsa'), 
(7, 'fdsafdsafdas'), 
(8, '恩'), 
(9, '恩'), 
(10, '恩'), 
(11, '恩11'), 
(12, '恩'), 
(13, '恩'), 
(14, '恩'), 
(15, '恩'), 
(16, '恩'), 
(17, '恩'), 
(18, '恩18');

下面介绍这些文件的功能

ajaxpg.js:ajax无刷新核心文件,一般不要去作修改.

index.php:实现ajax无刷新的文件了,这里调用了ajaxpg.js文件,配置了mysql用户密码,要和自己本地的一致,以及显示分页的效果.

page.css:这是分页的CSS样式文件,用来美化的,就不多介绍了.

brand.sql:这是MYSQL数据库的文件了,进行导入到MYSQL数据库中,同样,如果不会导入,可以参考PHPfensi.com中如何导入.sql文章即可。

例子非常的简单大家只要按流程来操作就ok啦,希望这篇文章能帮助大家真正的实现php+ajax无刷新分页。

PHP 相关文章推荐
Windows2003 下 MySQL 数据库每天自动备份
Dec 21 PHP
php动态生成JavaScript代码
Mar 09 PHP
php中的PHP_EOL换行符详细解析
Oct 26 PHP
学习php开源项目的源码指南
Dec 21 PHP
php计算两个整数的最大公约数常用算法小结
Mar 05 PHP
php中引用符号(&amp;)的使用详细介绍
Dec 06 PHP
自制PHP框架之模型与数据库
May 07 PHP
PHP+mysql实现的三级联动菜单功能示例
Feb 15 PHP
Yii2 queue的队列使用详解
Jul 19 PHP
PHP单文件上传原理及上传函数的封装操作示例
Sep 02 PHP
YII2框架中ActiveDataProvider与GridView的配合使用操作示例
Mar 18 PHP
如何在PHP中读写文件
Sep 07 PHP
PHP中Http协议post请求参数
Nov 02 #PHP
浅谈PHP中foreach/in_array的使用
Nov 02 #PHP
php防止用户重复提交表单
Nov 02 #PHP
windows8.1下Apache+Php+MySQL配置步骤
Oct 30 #PHP
php验证邮箱和ip地址最简单方法汇总
Oct 30 #PHP
php三种实现多线程类似的方法
Oct 30 #PHP
php搜索文件程序分享
Oct 30 #PHP
You might like
PHP 字符串分割和比较
2009/10/06 PHP
PHP性能优化工具篇Benchmark类调试执行时间
2011/12/06 PHP
php查看请求头信息获取远程图片大小的方法分享
2013/12/25 PHP
ThinkPHP实现转换数据库查询结果数据到对应类型的方法
2017/11/16 PHP
Yii2.0框架模型添加/修改/删除数据操作示例
2019/07/18 PHP
php5.6.x到php7.0.x特性小结
2019/08/17 PHP
JS两种定义方式的区别、内部原理
2013/11/21 Javascript
jQuery对象的length属性用法实例
2014/12/27 Javascript
浅析创建javascript对象的方法
2016/05/13 Javascript
JavaScript性能优化之函数节流(throttle)与函数去抖(debounce)
2016/08/11 Javascript
Vue.js中用v-bind绑定class的注意事项
2016/12/13 Javascript
JS+HTML5 FileReader对象用法示例
2017/04/07 Javascript
Vue组件全局注册实现警告框的实例详解
2018/06/11 Javascript
微信小程序canvas实现刮刮乐效果
2018/07/09 Javascript
公众号SVG动画交互实战代码
2020/05/31 Javascript
详解vue父子组件状态同步的最佳方式
2020/09/10 Javascript
[05:13]2018DOTA2亚洲邀请赛主赛事第二日战况回顾 LGD、VG双雄携手晋级
2018/04/05 DOTA
[50:48]LGD vs CHAOS 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
pip 错误unused-command-line-argument-hard-error-in-future解决办法
2014/06/01 Python
用python结合jieba和wordcloud实现词云效果
2017/09/05 Python
python实现简易数码时钟
2021/02/19 Python
用Python编写一个高效的端口扫描器的方法
2018/12/20 Python
python3编写ThinkPHP命令执行Getshell的方法
2019/02/26 Python
Python实现word2Vec model过程解析
2019/12/16 Python
OpenCV python sklearn随机超参数搜索的实现
2020/01/17 Python
tensorflow mnist 数据加载实现并画图效果
2020/02/05 Python
python可视化text()函数使用详解
2020/02/11 Python
Django返回HTML文件的实现方法
2020/09/17 Python
Biblibili视频投稿接口分析并以Python实现自动投稿功能
2021/02/05 Python
生产部主管岗位职责
2014/01/06 职场文书
法律专业自荐信
2014/06/03 职场文书
党员群众路线剖析材料
2014/10/08 职场文书
教师三严三实学习心得体会
2014/10/11 职场文书
员工离职通知函
2015/04/25 职场文书
新学期家长寄语2016
2015/12/03 职场文书
大学自主招生自荐信(2016精选篇)
2016/01/28 职场文书