web分页技术

来源：互联网发布：淘宝货到付款是现金么编辑：程序博客网时间：2024/05/23 19:27

信息类网站往往存在数据量过大的缺，想要达到迅速查找一般有两个方法，一是使用搜索，二是使用分页技术

今天我要讲的是分页技术，想要实现分页技术主要有三个部分

1.前端页面的静态搭建，我在建网站的时候运用的Bootstrap的css样式

<nav>  <ul class="pagination">    <li>      <a href="javascript:void(0);"onclick="checkPage(0)" aria-label="Previous">        <span aria-hidden="true">«</span>      </a>    </li>    <li><a href="javascript:void(0);"onClick="checkPage(1)">1</a></li>    <li><a href="javascript:void(0);"onClick="checkPage(2)">2</a></li>    <li><a href="javascript:void(0);"onClick="checkPage(3)">3</a></li>    <li><a href="javascript:void(0);"onClick="checkPage(4)">4</a></li>    <li><a href="javascript:void(0);"onClick="checkPage(5)">5</a></li>    <li  class="nav_First">      <a href="javascript:void(0);"onclick="checkPage(6)" aria-label="Next">        <span aria-hidden="true">»</span>      </a>    </li>  </ul></nav>

2.我们要对于输出的数据数量进行限制（规定每页的输出数量）

<?php session_start();?><?php include "mysql_connect.php" ?><link rel="stylesheet" href="css/indexPage2.css"  /><?php$sql=mysql_query("select title,datetime,author,id,honor from article order by id desc limit 0,10");$result=mysql_fetch_array($sql);if($result==false){echo "<font color=#ff0000>对不起，没有博客!</font>";}else{do{?><div class="list_Content"><div class="list_List">     <div class="list_Title">     <a href="showarticletest.php?id=<?php echo $result['id']; ?>"><?php echo $result['title'];?></a>     </div>     <div class="list_imformation">     <div class="list_detail">     <p><span><?php echo $result['datetime'];?></span>      作者：<?php echo $result['author'];?></p>     </div>     <div class="list_honor">          <div class="left_bar">               <div class="left_bar_srcimage" >               <div class="dislike"></div>               </div>               <div class="left_bar_number">               <?php echo $result['honor'];?>               </div>                   </div>                    <div class="right_bar">             <div class="right_bar_comment" >               <span class="glyphicon glyphicon-comment" aria-hidden="true"></span>                </div>               <div class="right_bar_number">               <?php                 $sql1=mysql_query("select times from article where title='$result[title]'");                $result1=mysql_fetch_array($sql1);                               echo $result1['times']; ?>               </div>              </div>     </div>     </div></div><div class="list_Image">    <img src="image/001.jpg">  </div></div><?php}while($result=mysql_fetch_array($sql));}?>

我们在这里呈现了前十的数据

3.对分页按钮的js设置，具体通过ajax设计的

// JavaScript Documentvar xmlhttp;function checkPage(cap){xmlhttp=CreateXmlHttp();if(xmlhttp==null){alert("创建xmlhttprequest对象失败");}var url="indexPage1.php"var url=url+"?q="+cap;var url=url+"&id="+Math.random(); xmlhttp.onreadystatechange=statechanged; xmlhttp.open("GET",url,true);     xmlhttp.send(null);}//创建URL，以及用open方法获取checkcap.php来实现异步传输。function statechanged(){if(xmlhttp.readyState==4&&xmlhttp.status==200){document.getElementById("wz").innerHTML=xmlhttp.responseText;}}//获取xmlhttprequest的状态，并将返回的内容输出function CreateXmlHttp(){var xmlhttp=null;try{xmlhttp=new XMLHttpRequest();}catch(e){try{xmlhttp=new ActiveXObject(Msxml2.XMLHTTP);}catch(e){xmlhttp=new ActiveXObject(Microsoft.XMLHTTP);}}return xmlhttp;}

4.ajax请求界面

<?php session_start();?><?php include "mysql_connect.php" ?><link rel="stylesheet" href="css/indexPage2.css"  /><script type="text/javascript" src="js/like.js" ></script><?php$CurrentPageID=$_GET['q'];if($CurrentPageID!=0&&$CurrentPageID!=6){$_SESSION['Page']=$CurrentPageID;}elseif($CurrentPageID==null){$_SESSION['Page']=1;}if($CurrentPageID==0){if($_SESSION['Page']==1){$sql=mysql_query("select title,datetime,author,ar_content,id,honor from article order by id desc limit 0,10");}elseif($_SESSION['Page']==2){$_SESSION['Page']=1;$sql=mysql_query("select title,datetime,author,ar_content,id,honor from article order by id desc limit 0,10");}elseif($_SESSION['Page']==3){$_SESSION['Page']=2;$sql=mysql_query("select title,datetime,author,ar_content,id,honor from article order by id desc limit 10,10");}elseif($_SESSION['Page']==4){$_SESSION['Page']=3;$sql=mysql_query("select title,datetime,author,ar_content,id,honor from article order by id desc limit 20,10");}elseif($_SESSION['Page']==5){$_SESSION['Page']=4;$sql=mysql_query("select title,datetime,author,ar_content,id,honor from article order by id desc limit 30,10");}}elseif($CurrentPageID==6){if($_SESSION['Page']==1){$_SESSION['Page']=2;$sql=mysql_query("select title,datetime,author,ar_content,id,honor from article order by id desc limit 10,10");}elseif($_SESSION['Page']==2){$_SESSION['Page']=3;$sql=mysql_query("select title,datetime,author,ar_content,id,honor from article order by id desc limit 20,10");}elseif($_SESSION['Page']==3){$_SESSION['Page']=4;$sql=mysql_query("select title,datetime,author,ar_content,id,honor from article order by id desc limit 30,10");}elseif($_SESSION['Page']==4){$_SESSION['Page']=4;$sql=mysql_query("select title,datetime,author,ar_content,id,honor from article order by id desc limit 40,10");}elseif($_SESSION['Page']==5){$_SESSION['Page']=5;$sql=mysql_query("select title,datetime,author,ar_content,id,honor from article order by id desc limit 40,10");}}elseif($CurrentPageID==1){$_SESSION['Page']=$CurrentPageID;$sql=mysql_query("select title,datetime,author,ar_content,id,honor from article order by id desc limit 0,10");}elseif($CurrentPageID==2){$_SESSION['Page']=$CurrentPageID;$sql=mysql_query("select title,datetime,author,ar_content,id,honor from article order by id desc limit 10,10");}elseif($CurrentPageID==3){$_SESSION['Page']=$CurrentPageID;$sql=mysql_query("select title,datetime,author,ar_content,id,honor from article order by id desc limit 20,10");}$result=mysql_fetch_array($sql);if($result==false){echo "<font color=#ff0000>对不起，没有博客!</font>";}else{do{?><div class="list_Content"><div class="list_List">     <div class="list_Title">     <a href="showarticletest.php?id=<?php echo $result['id']; ?>"><?php echo $result['title'];?></a>     </div>     <div class="list_imformation">     <div class="list_detail">     <p><span><?php echo $result['datetime'];?></span>      作者：<?php echo $result['author'];?></p>     </div>     <div class="list_honor">          <div class="left_bar">               <div class="left_bar_srcimage" >               <div class="dislike"></div>               </div>               <div class="left_bar_number">               <?php echo $result['honor'];?>               </div>                   </div>                    <div class="right_bar">             <div class="right_bar_comment" >               <span class="glyphicon glyphicon-comment" aria-hidden="true"></span>                </div>               <div class="right_bar_number">               <?php                 $sql1=mysql_query("select times from article where title='$result[title]'");                $result1=mysql_fetch_array($sql1);                               echo $result1['times']; ?>               </div>              </div>     </div>     </div></div><div class="list_Image">    <img src="image/001.jpg">  </div></div><?php}while($result=mysql_fetch_array($sql));}?>

通过这样我们就是实现了分页技术

0 0