• 企业400电话
  • 微网小程序
  • AI电话机器人
  • 电商代运营
  • 全 部 栏 目

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    ajax实现数据分页查询

    用ajax实现对数据库的查询以及对查询数据进行分页,供大家参考,具体内容如下

    主页面代码

    html xmlns="http://www.w3.org/1999/xhtml">
    head>
    meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    title>无标题文档/title>
    script src="jquery-1.11.2.min.js">/script>
    style type="text/css">
    .dangqian{ background-color:#69F}
    /style>
    /head>
    
    body>
    
    div>
    input type="text" id="key" />
    input type="button" value="查询" id="chaxun" />
    /div>
    
    table width="100%" border="1" cellpadding="0" cellspacing="0">
     tr>
      td>代号/td>
      td>名称/td>
      td>父级代号/td>
     /tr>
     
     tbody id="nr">
     
     /tbody> 
    /table>
    div id="xinxi">
    /div>
    /body>
    
    

    js代码

    script type="text/javascript">
    var page = 1; //当前页 定义一个变量 当前页
    
    
    Load(); //加载数据
    LoadXinXi(); //加载分页信息
    
    
    //查询
    $("#chaxun").click(function(){
      page = 1;
      Load(); //加载数据
      LoadXinXi(); //加载分页信息
     })
    function Load()
    {
     var key = $("#key").val(); //查询条件
     
     $.ajax({
       url:"chuli.php",
       data:{page:page,key:key},
       type:"POST",
       dataType:"JSON",
       success: function(data){
         var str = "";
         for(var k in data)
         {
          str +="tr>td>"+data[k].AreaCode+"/td>td>"+data[k].AreaName+"/td>td>"+data[k].ParentAreaCode+"/td>/tr>";
         }
         $("#nr").html(str);//把数据返回表格
        }
      });
    }
    
    
    functionLoadXinXi()
    {
     var str = "";
     var minys = 1;
     var maxys = 1;
     var key = $("#key").val();
     
     //查总页数
     $.ajax({
       async:false,
       url:"zys.php",
       data:{key:key},
       type:"POST",
       dataType:"TEXT",
       success: function(d){
         maxys = d;
        }
      });
     
     str += "span>总共:"+maxys+"页/span> nbsp;";
     str += "span id='prev'>上一页/span>";
     
     for(var i=page-2;ipage+3;i++)
     {
      if(i>=minys  i=maxys)
      {
       if(i==page)
       {
        str += "span class='dangqian' bs='"+i+"'>"+i+"/span> nbsp;";
       }
       else
       {
        str += "span class='list' bs='"+i+"'>"+i+"/span> nbsp;";
       }
      
      }
     }
      
     str += "span id='next'>下一页/span>"; 
     
     $("#xinxi").html(str);
     
     //给上一页添加点击事件
     $("#prev").click(function(){
       page = page-1;
       if(page1)
       {
        page=1;
       }
       Load(); //加载数据
       LoadXinXi(); //加载分页信息
      })
     //给下一页加点击事件
     $("#next").click(function(){
       page = page+1;
       if(page>maxys)
       {
        page=maxys;
       }
       Load(); //加载数据
       LoadXinXi(); //加载分页信息
      })
     //给中间的列表加事件
     $(".list").click(function(){
       page = parseInt($(this).attr("bs"));
       Load(); //加载数据
       LoadXinXi(); //加载分页信息
      })
    }
    
    /script>
    
    

    处理页面1

    ?php
    include("DBDA.class.php");
    $db = new DBDA();
    
    $key = $_POST["key"];
    $num = 20;
    
    $sql = "select count(*) from chinastates where areaname like '%{$key}%'";
    
    $zts = $db->StrQuery($sql);
    
    echo ceil($zts/$num);
    
    
    

    处理页面2

    ?php
    include("DBDA.class.php");
    $db = new DBDA();
    
    $page = $_POST["page"];
    $key = $_POST["key"];
    $num = 20;
    $tiao = ($page-1)*$num;
    
    $sql = "select * from chinastates where areaname like '%{$key}%' limit {$tiao},{$num}";
    
    echo $db->JSONQuery($sql);
    

    以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

    您可能感兴趣的文章:
    • ajax分页查询详解
    • Ajax写分页查询(实现不刷新页面)
    • ajax的分页查询示例(不刷新页面)
    • Ajax案例集下载:新增分页查询案例(包括《Ajax开发精要》中的两个综合案例) 下载
    • Spring Data JPA+kkpager实现分页功能实例
    • kkpager 实现ajax分页查询功能
    上一篇:Ajax与mysql数据交互制作留言板功能(全)
    下一篇:ajax实现三级联动的基本方法
  • 相关文章
  • 

    © 2016-2020 巨人网络通讯 版权所有

    《增值电信业务经营许可证》 苏ICP备15040257号-8

    ajax实现数据分页查询 ajax,实现,数据,分页,查询,