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 相关文章推荐
dedecms采集中可以过滤多行代码的正则表达式
Mar 17 PHP
php为什么选mysql作为数据库? Mysql 创建用户方法
Jul 02 PHP
关于IIS php调用com组件的权限问题
Jan 11 PHP
基于PHP遍历数组的方法汇总分析
Jun 08 PHP
如何使用FireFox插件FirePHP调试PHP
Jul 23 PHP
Apache连接PHP后无法启动问题解决思路
Jun 18 PHP
UPUPW 更新 64 位 Apache 系列 PHP 7.0 正式版
Dec 08 PHP
Yii2中cookie用法示例分析
Jul 18 PHP
php 使用fopen函数创建、打开文件详解及实例代码
Sep 24 PHP
浅谈Laravel核心解读之Console内核
Dec 02 PHP
php使用filter_var函数判断邮箱,url,ip格式示例
Jul 06 PHP
thinkPHP和onethink微信支付插件分享
Aug 11 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中路径问题的解决方案
2006/10/09 PHP
PHP 页面跳转到另一个页面的多种方法方法总结
2009/07/07 PHP
深入PHP许愿墙模块功能分析
2013/06/25 PHP
PHP如何实现订单的延时处理详解
2017/12/30 PHP
jQuery多媒体插件jQuery Media Plugin使用详解
2014/12/19 Javascript
JS判断网页广告是否被浏览器拦截过滤的代码
2015/04/05 Javascript
JavaScript中的普通函数与构造函数比较
2015/04/07 Javascript
javascript实现简单的鼠标拖动效果实例
2015/04/10 Javascript
微信JSAPI支付操作需要注意的细节
2017/01/10 Javascript
微信小程序 扎金花简单实例
2017/02/21 Javascript
JavaScript实现前端实时搜索功能
2020/03/26 Javascript
详解vue+vuex+koa2开发环境搭建及示例开发
2018/01/22 Javascript
React Form组件的实现封装杂谈
2018/05/07 Javascript
微信小程序实现富文本图片宽度自适应的方法
2019/01/20 Javascript
JavaScript封闭函数及常用内置对象示例
2019/05/13 Javascript
简单掌握Python中glob模块查找文件路径的用法
2016/07/05 Python
Python制作简易注册登录系统
2016/12/15 Python
python图像处理入门(一)
2019/04/04 Python
Python使用scipy模块实现一维卷积运算示例
2019/09/05 Python
python 最简单的实现适配器设计模式的示例
2020/06/30 Python
Matplotlib中rcParams使用方法
2021/01/05 Python
html5 canvas 画图教程案例分析
2012/11/23 HTML / CSS
HTML5 embed标签定义和用法详解
2014/05/09 HTML / CSS
台湾线上百货零售购物平台:friDay购物
2017/08/18 全球购物
Parfume Klik丹麦:香水网上商店
2018/07/10 全球购物
荷兰音乐会和音乐剧门票订购网站:Topticketshop
2019/08/27 全球购物
播音主持专业个人自我评价
2014/01/09 职场文书
英文导游欢迎词
2014/01/11 职场文书
英语教学随笔感言
2014/02/20 职场文书
大学信息公开实施方案
2014/03/09 职场文书
安全责任书范文
2014/08/25 职场文书
师德标兵事迹材料
2014/12/19 职场文书
关于清明节的演讲稿2015
2015/03/18 职场文书
2015年学校图书室工作总结
2015/05/19 职场文书
Django项目如何获得SSL证书与配置HTTPS
2021/04/30 Python
零基础学java之带参数以及返回值的方法
2022/04/10 Java/Android