Verwenden von Ajax zum Implementieren von Paging- und Paging-Abfragemethoden

Ich habe schon einmal eine Ajax-Ladeseite geschrieben. Es ist sehr einfach, die Seite zu aktualisieren. Das Schreiben der Seiten, die ich heute geschrieben habe, ist nicht erforderlich Kapseln Sie die Seite.Klasse .php,

wird einfach von js und Ajax

Um die Seite ordentlich und schön zu gestalten, habe ich zunächst Bootstrap verwendet und musste das erforderliche Dateipaket importieren

<link href="dist/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="../jquery/jquery-1.11.2.min.js"></script>
<script src="dist/js/bootstrap.min.js"></script>

Das Folgende ist der auf der Seite angezeigte Inhalt

e388a4556c0f65e1904146cc1a846bee843f82cb92bea033094ef2fe4249b6da 017f0682d63ab79a7b6970339546416494b3e26ee717c64999d7867364b1b4a3ff9d32c555bb1d9133a29eb4371c12139c055904c6cd70aff79ec36d1dee9f1c
  ae20bdd317918ca68efdc799512a9b39
    a34de1251f0d9fe1e645927f19a896e8
      b009427efdc04585fe9cb899358559f8国家代号01c3ce868d2b3d9bce8da5c1b7e41e5b
      b009427efdc04585fe9cb899358559f8国家名称01c3ce868d2b3d9bce8da5c1b7e41e5b
      798ba0c381050756f1f305da10447951父级代号01c3ce868d2b3d9bce8da5c1b7e41e5b
    fd273fcf5bcad3dfdad3c41bd81ad3e5
  7943277d65306330563feb42dc8c705a
  caef85e0ef71e23852aabac54bc6cd1c
   
  ca745a59da05f784b8811374296574e1f16b1740fad44fb09bfe928bcc527e08ff9d32c555bb1d9133a29eb4371c1213e388a4556c0f65e1904146cc1a846beee3dac11b1a41080571f82875543bd4cc929d1f5ca49e04fdcb27f9465b94468994b3e26ee717c64999d7867364b1b4a3

Das Folgende ist der js Teil, geschrieben mit Ajax

<script type="text/javascript">

var page = 1; //当前页

//加载数据
Load();
//加载分页信息
LoadFenYe();

//给查询加点击事件
$("#chaxun").click(function(){
        //将当前页重置
        page = 1;
        //加载数据
        Load();
        //加载分页信息
        LoadFenYe();
    })

//加载分页信息的方法
function LoadFenYe()
{
    var s = "";
    var name = $("#name").val();
    
    var minys = 1;
    var maxys = 1;
    $.ajax({
        async:false,
        data:{name:name},
        type:"POST",
        url:"zys.php",
        dataType:"TEXT",
        success: function(data){
                maxys = data;
            }
    });
    //加载上一页
    s += "<li class=&#39;syy&#39;><a>&laquo;</a></li>"; 
    
    //加载分页列表
    for(var i=page-4;i<page+5;i++)
    {
        if(i>=minys && i<=maxys)
        {
            if(i==page)
            {
                s += "<li class=&#39;active list&#39;><a>"+i+"</a></li>";
            }
            else
            {
                s += "<li class=&#39;list&#39;><a>"+i+"</a></li>";
            }
        }
    }
    
    //加载下一页
    s += "<li class=&#39;xyy&#39;><a>&raquo;</a></li>";
    
    //显示分页列表
    $("#fenye").html(s);
    
    //给列表加点击事件
    $(".list").click(function(){
            //改变当前页
            page = $(this).text();
            //加载数据
            Load();
            //加载分页信息
            LoadFenYe();
        })
    //上一页加点击事件
    $(".syy").click(function(){
            //改变当前页
            if(page>1)
            {
                page = parseInt(page)-1;
                //加载数据
                Load();
                //加载分页信息
                LoadFenYe();
            }
        })
    //下一页加点击事件
    $(".xyy").click(function(){
        
            //改变当前页
            if(page<maxys)
            {
                page = parseInt(page)+1;
                //加载数据
                Load();
                //加载分页信息
                LoadFenYe();
            }

        })
}

//加载数据的方法
function Load()
{
    var name = $("#name").val();
    $.ajax({
        url:"jiazai.php",
        data:{page:page,name:name},
        type:"POST",
        dataType:"TEXT",
        success: function(data){
                var str = "";
                var hang = data.split("|");
                for(var i=0;i<hang.length;i++)
                {
                    var lie = hang[i].split("^");
                    str = str+"<tr><td>"+lie[0]+"</td><td>"+lie[1]+"</td><td>"+lie[2]+"</td></tr>";
                }
                $("#tb").html(str);
                                
            }
    });
    
}

Der Code der jiazai.php-Seite lautet wie folgt:

<?php
include("DADB.class.php");
$db=new DADB();
$page=$_POST["page"];
$key=$_POST["name"];
$num=20;
$tiao=($page-1)*$num;
$sql="select * from chinastates WHERE areaname like &#39;%{$key}%&#39; limit {$tiao},{$num}";
echo $db->StrQuery($sql,1);

zys.php-Code Wie folgt:

<?php
include("DADB.class.php");
$db=new DADB();
$key=$_POST["name"];
$sql="select count(*) from chinastates where areaname like &#39;%{$key}%&#39;"; //显示总共有多少条内容
$zts=$db->StrQuery($sql);
echo ceil($zts/20);

Auf diese Weise können die Paging- und Abfragefunktionen ausgeführt werden vollständig verwirklicht

Das obige ist der detaillierte Inhalt vonVerwenden von Ajax zum Implementieren von Paging- und Paging-Abfragemethoden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!