zoukankan      html  css  js  c++  java
  • 8月21日 仿163邮箱中遇到的问题及解决(三)

    问题:

    2.以AJAX写分页

    3.系统设置中收件箱定时收件

    4.系统设置中垃圾邮件过期提醒

    解决:

    需要在处理页面将每页几条数据的值查出,传到主页面,在主页面进行处理后,传到指定位置即可,用AJAX写分页,主要是写方法。

    body内容:

    <body>
    <table id="tb" width="100%" border="1" cellpadding="0" cellspacing="0">
        
    </table>
    <div>
    <span id="shang">上一页</span>
    <span id="xia">下一页</span>
    <span>当前第:<input type="text" id="dq" value="1" />页</span>
    <span>总共:<span id="zys"></span>页</span>
    </div>
    </body><body>
    <table id="tb" width="100%" border="1" cellpadding="0" cellspacing="0">
        
    </table>
    <div>
    <span id="shang">上一页</span>
    <span id="xia">下一页</span>
    <span>当前第:<input type="text" id="dq" value="1" />页</span>
    <span>总共:<span id="zys"></span>页</span>
    </div>
    </body><body>
    <table id="tb" width="100%" border="1" cellpadding="0" cellspacing="0">
        
    </table>
    <div>
    <span id="shang">上一页</span>
    <span id="xia">下一页</span>
    <span>当前第:<input type="text" id="dq" value="1" />页</span>
    <span>总共:<span id="zys"></span>页</span>
    </div>
    </body>

    Ajax:注意:使用需引用js语言包

    <script type="text/javascript">
    $(document).ready(function(e) {
        FenYe();
        ZYS(2);
        
        $("#shang").click(function(){
                var dq = parseInt($("#dq").val());
                
                if(dq>1)
                {
                    $("#dq").val(dq-1);
                }
                else
                {
                    $("#dq").val(1);
                }
                FenYe();
            })
        
        $("#xia").click(function(){
                var dq = parseInt($("#dq").val());
                if(dq<$("#zys").text())
                {
                    $("#dq").val(dq+1);
                }
                else
                {
                    $("#dq").val($("#zys").text());
                }
                FenYe();
            })    
        
    });
    
    //实现分页的方法
    function FenYe()
    {
        var dq = $("#dq").val();
        $.ajax({
            url:"chuli.php",
            data:{page:dq},
            dataType:"JSON",
            type:"GET",
            success: function(data){
                
                var str = "<tr><td>代号</td><td>名称</td></tr>";
                for(var k in data)
                {
                    str=str+"<tr><td>"+data[k].Code+"</td><td>"+data[k].Name+"</td></tr>";
                }
                    $(tb).html(str);//将数据拆分返回相应表格
                }
            });
        
    }
    
    //根据每页几条数据求总页数
    function ZYS(n)
    {
        $.ajax({
            url:"zyschuli.php",
            data:{list:n},
            type:"POST",
            dataType:"TEXT",
            success: function(data){
                $("#zys").text(data);//数据总条数返回对应位置
                }
            });
    }
    
    </script>

    chuli.php;查询每页的数据,返回

    <?php
    
    include("DBDA.php");
    $db = new DBDA();
    
    include("page.class.php");
    
    $sql = "select count(*) from Nation";
    $zs = $db->StrQuery($sql);
    
    $page = new Page($zs,2);
    
    $sqlsj = "select * from Info ".$page->limit;
    //echo $sqlsj;
    echo $db->JsonQuery($sqlsj);

    zyschuli.php:查询总页数(数据总条数/每页数据条数),返回

    <?php
    
    include("DBDA.php");
    $db = new DBDA();
    
    $sql ="select count(*) from Info";
    $sj = $db->StrQuery($sql);
    
    $list = $_POST["list"];
    
    $zys = 0;
    if($sj%$list==0)
    {
        $zys = $sj/$list;
    }
    else
    {
        $zys = floor($sj/$list) +1;
    }
    
    echo $zys;

    示例:

  • 相关阅读:
    图片懒加载原理-实例二
    节流函数(throttle)的原理
    防抖动函数(debounce)的原理
    立即执行函数(immediate)的原理
    图片懒加载原理-实例三
    图片懒加载原理-实例四:首屏加载
    js运算符优先级
    java实现链栈
    java实现栈
    静态链表以及几种表的比较
  • 原文地址:https://www.cnblogs.com/dongqiaozhi/p/5803666.html
Copyright © 2011-2022 走看看