zoukankan      html  css  js  c++  java
  • 0619PHP练习:简单留言板

    登陆页面=============================================================================================================================

    <!DOCTYPE html>
    <html lang="zh">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta http-equiv="X-UA-Compatible" content="ie=edge" />
        <title>Document</title>
        <link rel="stylesheet" type="text/css" href="public/bootstrap.min.css"/>
        <script src="public/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="public/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
        <style type="text/css">
            *{
                margin: 0px auto;
                padding: 0px;
            }
            .box{
                 500px;
                height: 350px;
                border: 1px solid gray;
                border-radius: 5px;
                margin-top: 100px;
            }
            .box_title{
                 100%;
                height: 50px;
                font-size: 28px;
                text-align: center;
                margin-top: 20px;
            }
            .box_id{
                margin-left: 100px;
                margin-top: 20px;
            }
            .form-control{
                 300px;
                margin-bottom: 20px;
            }
            .box_but{
                 200px;
                margin-top: 30px;
            }
        </style>
    </head>
    <body>
        <div class="box">
            <div class="box_title">开发部内部留言板</div>
            <div class="box_id">
                <label>账号:</label>
                 <input type="text" class="form-control" placeholder="请输入账号" id="nid">
                 <label>密码:</label>
                 <input type="password" class="form-control" placeholder="请输入密码" id="npa">
            </div>
            <div class="box_but">
                <button class="btn" onclick="denglu()">&nbsp;&nbsp;登&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;录&nbsp;&nbsp;</button>
                <button class="btn">&nbsp;&nbsp;复&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;位&nbsp;&nbsp;</button>
            </div>
        </div>
    </body>
    </html>
    <script type="text/javascript">
        /*登陆======================================================================*/
        function denglu(){
            var nid = document.getElementById("nid").value;
            var npa = document.getElementById("npa").value;
            $.ajax({
                type:"post",
                url:"dlcl.php",
                async:true,
                data:{
                    typ:"denglu",
                    nid:nid,
                    npa:npa
                },
                dataType:"text",
                success:function(dl){
                    if(dl == "yes"){
                        window.location.href = "zhuye.php";
                    }else if(dl == "no"){
                        alert("密码错误,请重新输入!");
                    }else if(dl == "ik"){
                        alert("请输入账号!");
                    }else if(dl == "mk"){
                        alert("请输入密码!");
                    }
                }
            });
        }
        /*登陆======================================================================*/
    </script>

    登陆页面=============================================================================================================================

    主页面===============================================================================================================================

    <?php
        session_start();
        if(empty($_SESSION['bsa'])){
            header('Location:denglu.php');
            die;
        }
    ?>
    <!DOCTYPE html>
    <html lang="zh">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta http-equiv="X-UA-Compatible" content="ie=edge" />
        <title>Document</title>
        <link rel="stylesheet" type="text/css" href="public/bootstrap.min.css"/>
        <script src="public/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="public/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
        <style type="text/css">
            *{
                margin: 0px auto;
                padding: 0px;
            }
            body{
                -moz-user-select: none;
            }
            .title{
                 1260px;
            }
            .title_box{
                height: 60px;
                font-size: 28px;
                text-align: left;
                line-height: 60px;
                margin-left: 20px;
            }
            .nav{
                 1260px;
                border: 1px solid gray;
                border-radius: 5px 5px 0px 0px;
            }
            .nav_box{
                 500px;
                height: 50px;
                margin-left: 20px;
            }
            .nav_but{
                 100px;
                height: 30px;
                margin-top: 10px;
                float: left;
                line-height: 27px;
                text-align: center;
                margin-left: 51px;
                margin-right: 80px;
                border: 1px solid gray;
                border-radius: 5px;
            }
            .nav_but:hover{
                cursor: pointer;
            }
            .nav_text{
                height: 30px;
                margin-top: 10px;
                float: left;
                line-height: 30px;
            }
            .room{
                 1260px;
                height: 500px;
                border: 1px solid gray;
                border-radius: 0px 0px 5px 5px;
            }
            .room_boxa{
                 200px;
                height: 450px;
                margin-top: 20px;
                margin-left: 20px;
                float: left;
                border: 1px solid gray;
                border-radius: 5px;
            }
            .room_but{
                 100px;
                height: 30px;
                margin-top: 20px;
                line-height: 27px;
                text-align: center;
                border: 1px solid gray;
                border-radius: 5px;
            }
            .room_but:hover{
                cursor: pointer;
            }
            .room_boxb{
                 1000px;
                height: 450px;
                margin-top: 20px;
                margin-left: 20px;
                float: left;
                border: 1px solid gray;
                border-radius: 5px;
            }
            #fybut{
                font-size: 18px;
                text-align: center;
            }
            .fysp{
                cursor: pointer;
            }
            .room_room{
                height: 393px;
                border-bottom: 1px solid #DEE2E6;
            }
            .neirong{
                 175px;
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
            }
            .xiangqing:hover{
                cursor: pointer;
            }
            .room_boxc{
                 998px;
                height: 450px;
                margin: 20px;
                float: left;
                display: none;
                border: 1px solid gray;
                border-radius: 5px;
            }
            .boxc_title{
                 150px;
                float: left;
                border-right: 1px solid #DEE2E6;
            }
            .boxc_count{
                 846px;
                float: left;
            }
            .nrxq{
                height: 300px;
            }
            .fanyebox{
                margin-top: 15px;
            }
        </style>
    </head>
    <body>
        <div class="title">
            <div class="title_box">
                开发部内部留言板
            </div>
        </div>
        <div class="nav">
            <div class="nav_box">
                <div class="nav_but" onclick="zhuxiao()">退出系统</div>
                <div class="nav_text"><span style="color: red;"><?php echo $_SESSION['bsa'];?></span> 欢迎您登陆本系统</div>
            </div>
        </div>
        <div class="room">
            <div class="room_boxa">
                <div class="room_but" data-toggle="modal" data-target="#myModal">发布信息</div>
                <div class="room_but" onclick="ckxx()">所有信息</div>
            </div>
            <div class="room_boxb">
                <div class="room_room">
                    <table class="room_count table">
                    
                    </table>
                </div>
                <table class="fanyebox">
                    <tr>
                        <td id = 'fybut'></td>
                    </tr>
                </table>
            </div>
            <div class="room_boxc">
                <table class="boxc_title table">
                    <tr><td>发送人</td></tr>
                    <tr><td>接收人</td></tr>
                    <tr><td>发送时间</td></tr>
                    <tr style="height: 300px;"><td>内容</td></tr>
                </table>
                <table class="boxc_count table">
                    
                </table>
            </div>
        </div>
        <!-- 模态框 -->
        <div class="modal fade" id="myModal">
          <div class="modal-dialog">
            <div class="modal-content">
        
              <!-- 模态框头部 -->
              <div class="modal-header" style=" 420px;">
                <h4 class="modal-title">发布信息</h4>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
              </div>
        
              <!-- 模态框主体 -->
              <div class="modal-body" style=" 420px;">
                <label>接收人:</label>
                <input class="form-control upd" id = "addid">
                <label>内容:</label>
                <textarea  class="form-control upd" rows="10" id = "addtext"></textarea>
              </div>
        
              <!-- 模态框底部 -->
              <div class="modal-footer" style=" 420px;">
                <button type="button" class="btn btn-secondary" data-dismiss="modal" onclick="fabu()">提交</button>
              </div>
        
            </div>
          </div>
        </div>    
    </body>
    </html>
    <script type="text/javascript">
        var fybut = 0;
        var fb = 0;
        var fbz = 0;
        chaxun();
        function chaxun(){
            var xianshi = "7";
            $.ajax({
                type:"post",
                url:"dlcl.php",
                async:true,
                data:{
                    typ:"chaxun",
                    xianshi:xianshi,
                    fybut:fybut
                },
                dataType:"json",
                success:function(x){
                    var str = "<tr><td><div>时间</div></td><td><div>发送人</div></td><td><div>接收人</div></td><td><div>内容</div></td><td><div>查看状态</div></td></tr>";
                    for (var i =0;i < x.length;i++) {
                        str += "<tr>"
                        for (var j = 0; j < x[i].length;j++) {
                            if(x[i][j] == ""){
                                x[i][j] = "所有人";
                            }else if(x[i][j] == "0"){
                                x[i][j] = "未查看";
                            }else if(x[i][j] == "1"){
                                x[i][j] = "已查看";
                            }
                            if(j == 0){
                                
                            }else if(j == 4){
                                str += "<td class = 'xiangqing' onclick = 'xiangqing(""+x[i][0]+"")'><div class = 'neirong'>" + x[i][j] + "</div></td>";
                            }else{
                                str += "<td><div class = 'neirong'>" + x[i][j] + "</div></td>";
                            }
                        }
                        str += "</tr>"
                    }
                    document.getElementsByClassName("room_count")[0].innerHTML = str;
                }
            });
            $.ajax({
                type:"post",
                url:"dlcl.php",
                async:true,
                data:{
                    typ:"fybut"
                },
                dataType:"json",
                success:function(x){
                    var attrbut = "";
                    for (var i = 0;i < x.length/xianshi;i++) {    
                        if(i == fb){
                            attrbut += "<span class = 'fysp' onclick = 'fenyea(""+i+"")'>上一页 </span><span>" + (i+1) + " / " + Math.ceil(x.length/xianshi) + "</span><span class = 'fysp' onclick = 'fenyeb(""+i+"")'> 下一页 </span>&nbsp;&nbsp;&nbsp;第 <input class = 'fyroom' type = 'text' style = '20px;height:20px'></input> 页 <span class = 'fysp' onclick = 'fenyec()'>跳转 </span>";
                        }
                        fbz = Math.ceil(x.length/xianshi);
                    }
                    document.getElementById("fybut").innerHTML = attrbut;
                }
            });
        }
        function fenyea(){
            fb -= 1;
            if(fb < 0){
                fb = 0;
            }
            fybut -= 1;
            if(fybut < 0){
                fybut = 0;
            }
            chaxun();
        }
        function fenyeb(){
            fb += 1;
            if(fb > fbz-1){
                fb = fbz-1;
            }
            console.log(fb)
            fybut += 1;
            if(fybut > fbz-1){
                fybut = fbz-1;
            }
            chaxun();
        }
        function fenyec(){
            fb = document.getElementsByClassName("fyroom")[0].value-1;
            if(fb > fbz-1){
                fb = fbz-1;
            }else if(fb < 0){
                fb = 0;
            }
            fybut = document.getElementsByClassName("fyroom")[0].value-1;
            if(fybut > fbz-1){
                fybut = fbz-1;
            }else if(fybut < 0){
                fybut = 0;
            }
            chaxun();
        }
        function zhuxiao(){
            $.ajax({
                type:"post",
                url:"dlcl.php",
                async:true,
                data:{
                    typ:"zhuxiao"
                },
                dataType:"text",
                success:function(x){
                window.location.href = "denglu.php";
                }
            });
        }
        function fabu(){
            var addid = document.getElementById("addid").value;
            var addtext = document.getElementById("addtext").value;
            $.ajax({
                type:"post",
                url:"dlcl.php",
                async:true,
                data:{
                    typ:"fabu",
                    addid:addid,
                    addtext:addtext
                },
                dataType:"text",
                success:function(x){
                    
                }
            });
            chaxun();
        }
        function xiangqing(ids){
            document.getElementsByClassName("room_boxb")[0].style = "display:none";
            document.getElementsByClassName("room_boxc")[0].style = "display:block";
            $.ajax({
                type:"post",
                url:"dlcl.php",
                async:true,
                data:{
                    typ:"ckzt",
                    ids:ids
                },
                dataType:"text",
                success:function(x){
                }
            });
            $.ajax({
                type:"post",
                url:"dlcl.php",
                async:true,
                data:{
                    typ:"ckxq",
                    ids:ids
                },
                dataType:"json",
                success:function(x){
                    var str = "";
                    for (var i = 0;i < x[0].length;i++) {
                        if(x[0][i] == ""){
                            x[0][i] = "所有人"
                        }
                        if(i == 0){
                            
                        }else if(i == 5){
                            
                        }else if(i == 4){
                            str += "<tr class = 'nrxq'><td>"+x[0][i]+"</td></tr>";
                        }else{
                            str += "<tr><td>"+x[0][i]+"</td></tr>";
                        }
                    }
                    document.getElementsByClassName("boxc_count")[0].innerHTML = str;
                }
            });
        }
        function ckxx(){
            document.getElementsByClassName("room_boxb")[0].style = "display:block";
            document.getElementsByClassName("room_boxc")[0].style = "display:none";
            chaxun();
        }
    </script>

    主页面===============================================================================================================================

    处理页面===============================================================================================================================

    <?php
        session_start();
        $conn = new mysqli("localhost","root","","ceshi");
        $conn->connect_error?die("登陆失败"):"";
        $typ = $_POST['typ'];
        switch($typ){
            case "denglu":
            $nid = empty($_POST['nid'])?"kong":$_POST['nid'];
            $npa = empty($_POST['npa'])?"kong":$_POST['npa'];
            if($nid == "kong"){
                echo "ik";
            }else if($npa == "kong"){
                echo "mk";
            }else{
                $sqllan = "select password from yuangong where username = '{$nid}'";
                $doit = $conn->query($sqllan);
                $arr = $doit->fetch_row()[0];
                if($arr == $npa){
                    echo "yes";
                }else{
                    echo "no";
                }
                $sqllana = "select name from yuangong where username = '{$nid}'";
                $doita = $conn->query($sqllana);
                $arra = $doita->fetch_row()[0];
                $_SESSION['bsa'] = "{$arra}";
            }
            break;
            case "zhuxiao":
                session_destroy();
            break;
            case "chaxun":
                $bsa = $_SESSION['bsa'];
                $xianshi = $_POST['xianshi'];
                $fybut = $_POST['fybut'];
                $fybut = ($fybut)*6;
                if($bsa == "管理员"){
                    $sqllan = "select ids,times,sender,recever,comment,states from liuyan order by times desc limit {$fybut},{$xianshi}";
                }else{
                    $sqllan = "select ids,times,sender,recever,comment,states from liuyan where recever = '{$bsa}' or recever = '' order by times desc limit {$fybut},{$xianshi}";
                }
                $doit = $conn->query($sqllan);
                $arr = $doit->fetch_all();
                echo json_encode($arr);
            break;
            case "fabu":
                $addid = $_POST['addid'];
                $addtext = $_POST['addtext'];
                $times = date("Y-m-d H:i:s");
                $addname = $_SESSION['bsa'];
                $sqllan = "insert into liuyan values('','{$addname}','{$addid}','{$times}','{$addtext}','')";
                $doit = $conn->query($sqllan);
            break;
            case "fybut":
                $bsa = $_SESSION['bsa'];
                if($bsa == "管理员"){
                    $sqllan = "select * from liuyan";
                }else{
                    $sqllan = "select * from liuyan where recever = '{$bsa}' or recever = ''";
                }
                $doit = $conn->query($sqllan);
                $arr = $doit->fetch_all();
                echo json_encode($arr);
            break;
            case "ckzt":
                $ids = $_POST['ids'];
                $sqllan = "update liuyan set states = 1 where ids = '{$ids}'";
                $doit = $conn->query($sqllan);
            break;
            case "ckxq":
                $ids = $_POST['ids'];
                $sqllan = "select * from liuyan where ids = '{$ids}'";
                $doit = $conn->query($sqllan);
                $arr = $doit->fetch_all();
                echo json_encode($arr);
            break;
        }
    ?>

    处理页面===============================================================================================================================

  • 相关阅读:
    路由懒加载
    Generator函数
    属性特性get/set
    审核功能
    纯js实现最简单的文件上传(后台使用MultipartFile)
    shiro+redis多次调用doReadSession方法的解决方案
    nginx-windows版
    Spring—Quartz定时调度CronTrigger时间配置格式说明与实例
    java中获取文件目录
    mysql 在update中实现子查询的方式
  • 原文地址:https://www.cnblogs.com/zhangbaozhong/p/9197907.html
Copyright © 2011-2022 走看看