青岛做网站
        行业新闻
行业新闻
当前位置:首页> 新闻动态 > 行业新闻

在php中如何实现Ajax无刷新分页功能

更新时间:2019-02-28

   我们在使用PHP开发网站时会遇都有些页面需要实现无刷新分页,这时就需要用到Ajax无刷新分页的强大功能。因为在类似于存在视频播放的页面或者有很多图片需要轮换播放的页面,如果使用的不是无刷新分页,那么当执行翻页的操作后,视频文件将北重新打开;如果使用的是无刷新分页,就不会出现这种情况。

   为了更好的理解Ajax无刷新分页的强大功能,笔者就以实际案例来验证,这些先创建一个视频文件,并且应用Ajax无刷新分页输出文本内容。

首先,创建一个div标签,并且设置div标签的id="synopsis"。

然后,在div编辑中编写超长文本分页输出的代码,并且在超长文本分页的超级链接中应用onclick事件,调用自定义函数artpagination(),传递的参数为另一个实现分页功能的文件mr_synopsis_ok.php。其mr_synopsis.php关键代码如下:

 <div id="synopsis"><!--创建div标签,用于获取js文件中返回的分页结果-->

<table width="425" border="0" cellspacing="0" cellpadding="0">

  <tr>

  <td height="20">&nbsp;</td>

  </tr>

  <tr>

  <td>

<?php                         

//读取超长文本中的数据,实现超长文本中数据的分页显示

  if($_GET[’page’]){

         $counter=file_get_contents("file/mr_synopsis.txt");

  $length=strlen($counter);

  $page_count=ceil($length/950);

  $c=msubstr($counter,0,($_GET[’page’]-1)*950);

  $c1=msubstr($counter,0,$_GET[’page’]*950);

                echo substr($c1,strlen($c),strlen($c1)-strlen($c));

  }

?> </td>

  </tr>

  <tr>

  <td>

<table border="0" align="center" cellpadding="0" cellspacing="0">

  <tr><!--设置超长文本分页显示的超级连接-->

  <td width="42%" align="center" valign="middle" bgcolor="#FFFFFF"><span class="STYLE1">&nbsp;&nbsp;页次:<?php echo $_GET[’page’];?> / <?php echo $page_count;?> 页 </span></td>

  <td width="58%" height="28" align="left" valign="middle" bgcolor="#FFFFFF"><span class="STYLE1"> &nbsp;分页:

<?php

 if($_GET[’page’]!=1){

?>

<!--调用artpagination函数,实现无刷新的分页输出-->

<a href="#" onclick=’return artpagination("mr_synopsis_ok.php?page=1")’>首页</a>&nbsp;

 <a href="#" onclick=’return artpagination("mr_synopsis_ok.php?&page=<?php echo $_GET[’page’]-1;?>")’>上一页</a>&nbsp;

<?php }

  if($_GET[’page’]<$page_count){

?>

<a href="#" onclick=’return artpagination("mr_synopsis_ok.php?page=<?php echo $_GET[’page’]+1;?>")’>下一页</a>&nbsp;<a href="#" onclick=’return artpagination("mr_synopsis_ok.php?page=<?php echo $page_count;?>")’>尾页</a>                                

<?php

    }                                

  ?>

  </span> </td>

  </tr>

</table></td>

  </tr>

  </table>

</div>

最后,通过js文件中自定义函数artpagination()将mr_synopsis_ok.php文件中的分页结果返回到div标签dynopsis中,实现无刷新分页功能。其中js文件中关键代码如下:

var xmlHttp=createXmlHttpRequestObject();

 

//获取XMLHttpRrequest对象

function createXmlHttpRequestObject(){

        //用来存储将要使用的XMLHttpRrequest对象

        var xmlHttp;

        //如果在internet Explorer下运行

        if(window.ActiveXObject){

                try{

                        xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");

                }catch(e){

                        xmlHttp=false;

                }

 

        }else{

        //如果在Mozilla或其他的浏览器下运行

                try{

                        xmlHttp=new XMLHttpRequest();

                }catch(e){

                        xmlHttp=false;

                }

        }

         //返回创建的对象或显示错误信息

        if(!xmlHttp)

                alert("返回创建的对象或显示错误信息");

                else

                return xmlHttp;

}

//使用XMLHttpRequest对象创建异步HTTP请求

function artpagination(url){                        //创建自定义函数,获取传递的参数

        xmlHttp.open(’get’,url,true);                //根据传递的参数,通过get方法,执行另外一个实现分页功能的文件

        xmlHttp.onreadystatechange = function(){

                if(xmlHttp.readyState == 4 && xmlHttp.status == 200){        //将结果返回到div标签synopsis中

                        document.getElementById("synopsis").innerHTML = xmlHttp.responseText;

                }

        }

        xmlHttp.send(null);

}

 总之,在php中实现Ajax无刷新分页功能是比较常用的功能,希望对大家有所帮助。

 

 

免责声明:本站所有资讯内容搜集整理于互联网或者网友提供,并不代表本网赞同其观点,仅供学习与交流使用,如果不小心侵犯到你的权益,如果你对文章内容、图片和版权等问题存在异议,请及时联系我们删除该信息。