Home Backend Development PHP Tutorial php+ajax实现无刷新数据分页的办法_PHP

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

May 29, 2016 am 11:48 AM
php

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

index.php 文件,代码如下:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

<&#63;php

header("Content-type: text/html;charset=GBK");//输出编码,避免中文乱码

&#63;>

<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">

<&#63;php

$page=isset($_GET['page'])&#63;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;//

$offset=($page-1)*$num; //获取limit的第一个参数的值,假如第一页则为(1-1)*10=0,第二页为(2-1)*10=10。

$pagenav="<ul>";

  

//开始分页导航条代码:

$pagenav.="<li>显示第 <B>".($total&#63;($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&#63;page=1');>首页</a></li> ";

if($prepg) $pagenav.="<li> <a href=javascript:dopage('result','$url&#63;page=$prepg');>前页</a></li> "; else $pagenav.=" <li>前页</li> ";

if($nextpg) $pagenav.="<li><a href=javascript:dopage('result','$url&#63;page=$nextpg');>后页</a> </li>"; else $pagenav.=" <li>后页</li> ";

$pagenav.="<li> <a href=javascript:dopage('result','$url&#63;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

}

&#63;></div><div id="results">

<&#63;php

 echo $pagenav;//输出分页导航

&#63;>

</div>

</body>

</html>

Copy after login

css代码:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

/* 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;

}

Copy after login

ajaxpg.js文件,如下:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

// 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;

}

Copy after login

数据库文件,如下:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

-- 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');

Copy after login

下面介绍这些文件的功能

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

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

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

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

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

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
2 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Best Graphic Settings
2 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. How to Fix Audio if You Can't Hear Anyone
2 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

CakePHP Project Configuration CakePHP Project Configuration Sep 10, 2024 pm 05:25 PM

In this chapter, we will understand the Environment Variables, General Configuration, Database Configuration and Email Configuration in CakePHP.

PHP 8.4 Installation and Upgrade guide for Ubuntu and Debian PHP 8.4 Installation and Upgrade guide for Ubuntu and Debian Dec 24, 2024 pm 04:42 PM

PHP 8.4 brings several new features, security improvements, and performance improvements with healthy amounts of feature deprecations and removals. This guide explains how to install PHP 8.4 or upgrade to PHP 8.4 on Ubuntu, Debian, or their derivati

CakePHP Date and Time CakePHP Date and Time Sep 10, 2024 pm 05:27 PM

To work with date and time in cakephp4, we are going to make use of the available FrozenTime class.

CakePHP File upload CakePHP File upload Sep 10, 2024 pm 05:27 PM

To work on file upload we are going to use the form helper. Here, is an example for file upload.

CakePHP Routing CakePHP Routing Sep 10, 2024 pm 05:25 PM

In this chapter, we are going to learn the following topics related to routing ?

Discuss CakePHP Discuss CakePHP Sep 10, 2024 pm 05:28 PM

CakePHP is an open-source framework for PHP. It is intended to make developing, deploying and maintaining applications much easier. CakePHP is based on a MVC-like architecture that is both powerful and easy to grasp. Models, Views, and Controllers gu

CakePHP Working with Database CakePHP Working with Database Sep 10, 2024 pm 05:25 PM

Working with database in CakePHP is very easy. We will understand the CRUD (Create, Read, Update, Delete) operations in this chapter.

CakePHP Creating Validators CakePHP Creating Validators Sep 10, 2024 pm 05:26 PM

Validator can be created by adding the following two lines in the controller.

See all articles