php使用jQuery+Ajax實作分頁查詢功能的範例-php教程-PHP中文網

首頁

後端開發

php教程

php使用jQuery+Ajax實作分頁查詢功能的範例

黄舟

Sep 18, 2017 am 09:15 AM

php查詢功能

下面小編就為大家帶來一篇PHP中使用jQuery+Ajax實作分頁查詢多功能操作(範例講解)。小編覺得蠻不錯的，現在就分享給大家，也給大家做個參考。一起跟著小編過來看看吧

1.先做主頁Ajax_pag.php

程式碼如下：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Ajax做分页</title>
    <script src="bootstrap/js/jquery-1.11.2.min.js"></script>
    <script src="Ajax_pag.js"></script>
    <script src="bootstrap/js/bootstrap.min.js"></script>
    <link href="bootstrap/css/bootstrap.min.css" rel="external nofollow" rel="stylesheet" type="text/css"/>
  </head>
  <style>
    .header{
      margin-top: 20px;
    }
  </style>
  <body>
    <p >
      关键字：
      <input id="key" type="text" name="gjz"/>
      <input type="button" value="查询" id="ck" />
      
    </p>
    <table class="table table-bordered header">
      <thead>
        <tr>
          <th>地区代号</th>
          <th>地区名称</th>
          <th>父级代号</th>
        </tr>
      </thead>
      <tbody id="list">

      </tbody>
    </table>

    <p >
      <ul class="pagination" id="fenye">

      </ul>
    </p>

    </body> 
</html>

2.然後做分頁查詢JS頁面Ajax_pag.js

程式碼如下：

//ajax分页开始
    var ts = 10;//每页显示的条数
    var page = 1;//当前页
    $(document).ready(function(e) {
      //页面加载数据
      Load();
      //加载分页列表
      Loadlist();
      $("#ck").click(function(){    
    //页面加载数据
    Load();
    //加载分页列表
    Loadlist();    
  })
})        
    
    //加载数据的方法
    function Load(){  
      var gjz = $("#key").val();
        $.ajax({
            async:false,
            url:"pagechuli.php",
            data:{page:page,ts:ts,gjz:gjz},//page是显示的页数；ts是显示的条数
            type:"POST",
            dataType:"JSON",               
            success: function(data){                             
                  var str ="";            
                  for(var k in data)
                  {
                  str +="<tr><td>"+data[k][0]+"</td><td>"+data[k][1]+"</td><td>"+data[k][2]+"</td></tr>";
                  }
                  $("#list").html(str);//把拼接好的字符串放到要显示的thody里面                          
                }
              })
            }  
    //加载分页列表      
    function Loadlist(){
      var str ="";    
      //上一页
      str+="<li><a id=&#39;prev&#39;>«</a></li>";
      //加载列表
      for(var i=page-4;i<page+5;i++){
        //限制条件
        if(i>0 && i<=zys()){
        //判断当前页
        if(i==page){  
          str+= "<li class=&#39;active&#39;><a>"+i+"</a></li>";  
      }else{
      str+= "<li><a class=&#39;item&#39;>"+i+"</a></li>";
      }
    }    
  }
      //下一页
      str+="<li><a id=&#39;next&#39;>»</a></li>";
      $("#fenye").html(str);
      
      $("#prev").click(function(){
        if(page>1){
          page--;          
        }
        //页面加载数据
        Load();
        //加载分页列表
        Loadlist();
      })
      
      $(".item").click(function(){
        var p = $(this).text();//取到的是字符串,转化为整数
        page = parseInt(p);
        //页面加载数据
        Load();
        //加载分页列表
        Loadlist();
      })
      
      $("#next").click(function(){
        if(page<zys()){
          page++;
        }
        //页面加载数据
        Load();
        //加载分页列表
        Loadlist();
      })
      
    }
  
  
  
  
  //总页数
  function zys(){
    var zys = 0;
    $.ajax({
      async:false,
      url:"zyschuli.php",
      dataType:"TEXT",
      success:function(data){
        zys = Math.ceil(data/ts);
      }
    });
    return zys;
  }

3.最後做分頁查詢處理頁面pagechuli.php

#程式碼如下：

<?php
$gjz = $_POST["gjz"];
$page = $_POST["page"];//获取页数显示值
$ts = $_POST["ts"];//获取每页条数显示值

require_once "./DBDA.class.php";
$db = new DBDA();

$tj = " 1=1 ";
if(!empty($_POST["gjz"])){
  $gjz = $_POST["gjz"];
  $tj = " areaname like &#39;%{$gjz}%&#39; or areacode like &#39;%{$gjz}%&#39; or parentareacode like &#39;%{$gjz}%&#39; ";
}

$tg = ($page-1)*$ts;//每页显示$ts条数据，这里显示的就是当前页的$tg条数据。
$sql = "select * from chinastates where {$tj} limit {$tg},{$ts}";
echo $db->JsonQuery($sql,0)

小外掛：總頁數的處理頁面zyschuli.php

<?php
require_once "./DBDA.class.php";
$db = new DBDA();

$sql = "select count(*) from chinastates";
echo $db->StrQuery($sql,0);

效果如圖：

關鍵字查詢：

以上是php使用jQuery+Ajax實作分頁查詢功能的範例的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

簡單地說明PHP會話的概念。Apr 26, 2025 am 12:09 AM

phpsessionstrackuserdataacrossmultiplepagerequestsusingauniqueIdStoredInAcookie.here'showtomanageThemeffectionaly：1）startAsessionWithSessionWwithSession_start（）和stordoredAtain $ _session.2）

您如何循環中存儲在PHP會話中的所有值？Apr 26, 2025 am 12:06 AM

在PHP中，遍歷會話數據可以通過以下步驟實現：1.使用session_start()啟動會話。 2.通過foreach循環遍歷$_SESSION數組中的所有鍵值對。 3.處理複雜數據結構時，使用is_array()或is_object()函數，並用print_r()輸出詳細信息。 4.優化遍歷時，可採用分頁處理，避免一次性處理大量數據。這將幫助你在實際項目中更有效地管理和使用PHP會話數據。

說明如何使用會話進行用戶身份驗證。Apr 26, 2025 am 12:04 AM

會話通過服務器端的狀態管理機制實現用戶認證。 1)會話創建並生成唯一ID，2)ID通過cookies傳遞，3)服務器存儲並通過ID訪問會話數據，4)實現用戶認證和狀態管理，提升應用安全性和用戶體驗。

舉一個如何在PHP會話中存儲用戶名的示例。Apr 26, 2025 am 12:03 AM

Tostoreauser'snameinaPHPsession,startthesessionwithsession_start(),thenassignthenameto$_SESSION['username'].1)Usesession_start()toinitializethesession.2)Assigntheuser'snameto$_SESSION['username'].Thisallowsyoutoaccessthenameacrossmultiplepages,enhanc

哪些常見問題會導致PHP會話失敗？Apr 25, 2025 am 12:16 AM

PHPSession失效的原因包括配置錯誤、Cookie問題和Session過期。 1.配置錯誤：檢查並設置正確的session.save_path。 2.Cookie問題：確保Cookie設置正確。 3.Session過期：調整session.gc_maxlifetime值以延長會話時間。

您如何在PHP中調試與會話相關的問題？Apr 25, 2025 am 12:12 AM

在PHP中調試會話問題的方法包括：1.檢查會話是否正確啟動；2.驗證會話ID的傳遞；3.檢查會話數據的存儲和讀取；4.查看服務器配置。通過輸出會話ID和數據、查看會話文件內容等方法，可以有效診斷和解決會話相關的問題。

如果session_start（）被多次調用會發生什麼？Apr 25, 2025 am 12:06 AM

多次調用session_start()會導致警告信息和可能的數據覆蓋。 1)PHP會發出警告，提示session已啟動。 2)可能導致session數據意外覆蓋。 3)使用session_status()檢查session狀態，避免重複調用。

您如何在PHP中配置會話壽命？Apr 25, 2025 am 12:05 AM

在PHP中配置會話生命週期可以通過設置session.gc_maxlifetime和session.cookie_lifetime來實現。 1)session.gc_maxlifetime控制服務器端會話數據的存活時間，2)session.cookie_lifetime控制客戶端cookie的生命週期，設置為0時cookie在瀏覽器關閉時過期。

See all articles