Home > php教程 > php手册 > php+ajax实现无刷新分页的方法,ajax分页

php+ajax实现无刷新分页的方法,ajax分页

WBOY
Release: 2016-06-13 09:22:12
Original
1204 people have browsed it

php+ajax实现无刷新分页的方法,ajax分页

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

这是一款基于原生态的php +js +ajax 的分页程序实例,我们详细的从数据库创建到js,php,html页面的创建来告诉你如何实现ajax分页调用数据的方法。

具体步骤如下:

一、创建数据库

SQL语句如下:

复制代码 代码如下:

CREATE TABLE `tb_user` (
  `id` int(10) NOT NULL auto_increment,
  `username` varchar(50) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8 AUTO_INCREMENT=10 ;

INSERT INTO `tb_user` VALUES (1, 'aaa');
INSERT INTO `tb_user` VALUES (2, 'bbb');
INSERT INTO `tb_user` VALUES (3, 'ccc');
INSERT INTO `tb_user` VALUES (4, 'ddd');
INSERT INTO `tb_user` VALUES (5, 'eee');
INSERT INTO `tb_user` VALUES (6, 'fff');
INSERT INTO `tb_user` VALUES (7, 'ggg');
INSERT INTO `tb_user` VALUES (8, 'hhh');
INSERT INTO `tb_user` VALUES (9, '����');

二、ajaxpage.js文件代码如下:

复制代码 代码如下:

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(reobj).innerHTML=http_request.responseText;
     }
     else{//页面不正常
      alert("您所请求的页面不正常!");
     }
   }
  }
  function dopage(obj,url){
   document.getElementById(obj).innerHTML="正在读取数据...";
   reobj = obj;
   send_request(url);
   }


三、php调用代码如下:

复制代码 代码如下:

PHP+ajax分页演示



$terry=mysql_connect("localhost","root","")or die("连接数据库失败:".mysql_error());
mysql_select_db("ajaxtest",$terry);
mysql_query("set NAMES 'utf8'");
$result=mysql_query("select * from tb_user");
$total=mysql_num_rows($result) or die(mysql_error());
$page=isset($_GET['page'])?intval($_GET['page']):1;
$page_size=3;
$url='index.php';
$pagenum=ceil($total/$page_size);
$page=min($pagenum,$page);
$prepage=$page-1;
$nextpage=($page==$pagenum?0:$page+1);
$pageset=($page-1)*$page_size;
$pagenav='';
$pagenav.="显示第".($total?($pageset+1):0)."-".min($pageset+5,$total)."记录 共".$total."条记录 现在是第 ".$page." 页 ";
if($page $pagenav.="首页 ";
else
$pagenav.="首页 ";
if($prepage)
$pagenav.="上一页 ";
else
$pagenav.="上一页 ";
if($nextpage)
$pagenav.="下一页 ";
else
$pagenav.="下一页 ";
if($pagenum)
$pagenav.="尾页 ";
else
$pagenav.="尾页 ";
$pagenav.="共".$pagenum."页";
if($page>$pagenum){
    echo "error:没有此页".$page;
    exit();
}
?>

 
   
   
 
$info=mysql_query("select * from tb_user order by id desc limit $pageset,$page_size");
while($array=mysql_fetch_array($info)){
?>
 
   
   
 
}
?>
用户名 用户密码

echo "

$pagenav

";
?>

希望本文所述对大家的PHP程序设计有所帮助。

为何用PHP+ajax 实现了无刷新分页,但是全选按钮就失效了?怎解决

全选按钮的onchange事件要在通过ajax获取到列表数据后,加上onchange事件,这里是可以获取到列表里的checkbox的,在页面上直接调用js的话,已经出了作用域,js是获取不到列表里的checkbox的.
 

谁给我讲下ajax+php无刷新分页原理

ajax 是一个js脚本。或者用jquery里面的ajax
如果你要验证用户名。你可以在你的input 属性里面加上 onchange=“调用函数”
调用函数就是ajax的代码。
ajax是这样完成工作的,
首先发送请求到你指定的页面比如abc.php(附带你设置的post或者get),
abc.php响应成功后,执行它里面的代码去处理你传递过来的参数。如果存在这个用户。然后返回一个值或者函数 如果不存在也会返回一个值或者函数,你要自己去设置。
然后ajax把这个返回的值或者函数进行处理,比如显示它,或者调用函数禁用提交按钮。
 

Related labels:
source:php.cn
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
Popular Recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template