php+ajax實(shí)現(xiàn)無(wú)刷新數(shù)據(jù)分頁(yè)例子
無(wú)刷新功能我們用到很多很多的,下面我就來(lái)給各位介紹一個(gè)實(shí)例,就是實(shí)現(xiàn)php+ajax實(shí)現(xiàn)無(wú)刷新數(shù)據(jù)分頁(yè)了,例子非常的簡(jiǎn)單大家只要按流程來(lái)操作就可以了哦.
index.php 文件代碼如下:
<?php
header("Content-type: text/html;charset=GBK");/pic/div>
?>
<html>
<head>
<title>ajax分頁(yè)演示</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; /pic/div>
$num=3; /pic/div>
$db=mysql_connect("localhost","root","123456"); /pic/div>
mysql_select_db("demo",$db) or die("數(shù)據(jù)庫(kù)鏈接錯(cuò)誤"); /pic/div>
mysql_query("set names gbk");
/*
首先咱們要獲取數(shù)據(jù)庫(kù)中到底有多少數(shù)據(jù)，才能判斷具體要分多少頁(yè)，具體的公式就是
總數(shù)據(jù)庫(kù)除以每頁(yè)顯示的條數(shù)，有余進(jìn)一。
也就是說(shuō)10/3=3.3333=4 有余數(shù)就要進(jìn)一。
*/
$result=mysql_query("select * from brand");
$total=mysql_num_rows($result); /pic/div>
$url='test.php';/pic/div>
/pic/div>
$pagenum=ceil($total/$num);/pic/div>
$page=min($pagenum,$page);/pic/div>
$prepg=$page-1;/pic/div>
$nextpg=($page==$pagenum ? 0 : $page+1);/pic/div>
$offset=($page-1)*$num; /pic/div>
$pagenav="<ul>";
/pic/div>
$pagenav.="<li>顯示第 <B>".($total?($offset+1):0)."</B>-<B>".min($offset+10,$total)."</B> 條記錄</li><li>共 $total 條記錄 </li>";
/pic/div>
if($pagenum<=1) return false;
$pagenav.="<li> <a href=javascript：dopage('result','$url?page=1');>首頁(yè)</a></li> ";
if($prepg) $pagenav.="<li> <a href=javascript：dopage('result','$url?page=$prepg');>前頁(yè)</a></li> "; else $pagenav.=" <li>前頁(yè)</li> ";
if($nextpg) $pagenav.="<li><a href=javascript：dopage('result','$url?page=$nextpg');>后頁(yè)</a> </li>"; else $pagenav.=" <li>后頁(yè)</li> ";
$pagenav.="<li> <a href=javascript：dopage('result','$url?page=$pagenum');>尾頁(yè)</a></li> ";
$pagenav.="<li>第 $page 頁(yè)</li><li>共 $pagenum 頁(yè)</li></ul>";
/pic/div>
If($page>$pagenum){
Echo "Error : Can Not Found The page ".$page;
Exit; /pic/div>
}
?></div><div id="results">
<?php
echo $pagenav;/pic/div>
?>
</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文件如下:
/pic/div>
var http_request=false;
function send_request(url){/pic/div>
http_request=false;
/pic/div>
if(window.XMLHttpRequest){/pic/div>
http_request=new XMLHttpRequest();
if(http_request.overrideMimeType){/pic/div>
http_request.overrideMimeType("text/xml");
}
}
else if(window.ActiveXObject){/pic/div>
try{
http_request=new ActiveXObject("Msxml2.XMLHttp");
}catch(e){
try{
http_request=new ActiveXobject("Microsoft.XMLHttp");
}catch(e){}
}
}
if(!http_request){/pic/div>
window.alert("創(chuàng)建XMLHttp對(duì)象失��！");
return false;
}
http_request.onreadystatechange=processrequest;
/pic/div>
http_request.open("GET",url,true);
http_request.send(null);
}
/pic/div>
function processrequest(){
if(http_request.readyState==4){/pic/div>
if(http_request.status==200){/pic/div>
document.getElementById("results").style.display="none";
document.getElementById(reobj).innerHTML=http_request.responseText;
}
else{/pic/div>
alert("您所請(qǐng)求的頁(yè)面不正常！");
}
}
}
function dopage(obj,url){
document.getElementById(obj).innerHTML="<font color='green' font-size='12'>正在讀取數(shù)據(jù)...</font>";
send_request(url);
reobj=obj;
}
數(shù)據(jù)庫(kù)文件如下:
-- phpMyAdmin SQL Dump
-- version 2.8.1
-- /pic/div>
--
-- 主機(jī): localhost
-- 生成日期: 2010 年 01 月 22 日 14:41
-- 服務(wù)器版本: 5.0.22
-- PHP 版本: 5.2.12
--
-- 數(shù)據(jù)庫(kù): `demo`
--
-- --------------------------------------------------------
--
-- 表的結(jié)構(gòu) `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 ;
--
-- 導(dǎo)出表中的數(shù)據(jù) `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無(wú)刷新核心文件,一般不要去作修改.
index.php:實(shí)現(xiàn)ajax無(wú)刷新的文件了,這里調(diào)用了ajaxpg.js文件,配置了mysql用戶密碼,要和自己本地的一致,以及顯示分頁(yè)的效果.
page.css:這是分頁(yè)的CSS樣式文件,用來(lái)美化的,就不多介紹了.
brand.sql:這是MYSQL數(shù)據(jù)庫(kù)的文件了,進(jìn)行導(dǎo)入到MYSQL數(shù)據(jù)庫(kù)中,同樣,如果不會(huì)導(dǎo)入,可以參考PHPfensi.com中如何導(dǎo)入.sql文章即可.
【php+ajax實(shí)現(xiàn)無(wú)刷新數(shù)據(jù)分頁(yè)例子】相關(guān)文章：
php+ajax實(shí)現(xiàn)無(wú)刷新的新聞留言系統(tǒng)01-10
如何實(shí)現(xiàn)bootstrap jquery dataTable異步ajax刷新表格數(shù)據(jù)02-01
基于PHP+Ajax實(shí)現(xiàn)表單驗(yàn)證的詳解01-01
PHP如何使用curl實(shí)現(xiàn)數(shù)據(jù)抓取02-05
cakephp的分頁(yè)排序12-09
word怎樣自動(dòng)分頁(yè)02-20
php分頁(yè)類代碼10-03