一个留言本登录窗口：
下面是代码
<!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" /> <link rel="stylesheet" type="text/css" href="../bootstrap-3.3.7-dist/css/bootstrap.min.css"/> <script src="../0614/public/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script> <script src="../bootstrap-3.3.7-dist/js/bootstrap.min.js" type="text/javascript"></script> <title>Document</title> </head> <body> 开发部内部留言板 <div>用户名：<input type="text" name="name" id="name" /></div><br /> <div>密码：<input type="password" name="mima" id="mima" /></div><br /> <input type="submit" value="登陆" onclick="denglu()"/> </body> </html> <script type="text/javascript"> function denglu(){ var name = document.getElementById("name").value; var mima = document.getElementById("mima").value; $.ajax({ type:"post", url:"dengluchuli.php", async:true, data:{ type:"denglu", name:name, mima:mima }, dataType:"text", success:function(data){ alert(data); if(data == "ok"){ window.location.href="xitongyemian.php"; }else { alert("账号密码错误"); } } }); } </script>
接下来是登录处理页面：
<?php session_start(); $type =$_POST['type']; $name =$_POST['name']; $mima =$_POST['mima']; $conn =new mysqli("localhost","root","","ceshi3"); $conn->connect_error?die("链接失败"):""; $sql = "select * from yuangong where UserName = '{$name}'"; $result = $conn->query($sql); $attr = $result->fetch_all(); if($attr[0][1] == $mima){ $_SESSION["name"] = $name; echo "ok"; }else { echo "no"; } ?>
接下来进行跳转,跳转到系统主页的收件箱页面包含已读未读等功能。
<!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" /> <link rel="stylesheet" type="text/css" href="../bootstrap-3.3.7-dist/css/bootstrap.min.css"/> <script src="../0614/public/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script> <script src="../bootstrap-3.3.7-dist/js/bootstrap.min.js" type="text/javascript"></script> <title>Document</title> <style type="text/css"> .daohang{ 18%; height: 300px; background-color: #204D74; color: #0069D9; text-align: center; line-height: 20px; float: left; } .liebiao{ 100%; height: 30px; background-color: #204D74; color: #20C997; text-align: center; line-height: 30px; margin-top: 50px; } .liebiao:hover{ background-color: #B92C28; color: #C4E3F3; cursor:pointer; } .neirong{ 82%; height: 500px; background-color: #6C757D; float: right; } </style> </head> <body> <div><a href="tuichu.php">退出系统</a></div> <div class="daohang"> <div class="liebiao" onclick="shoujian()" >收件箱</div> <div class="liebiao" onclick="fajian()">发件箱</div> </div> <div class="neirong" > </div> <div class="container"> <!-- 模态框 --> <div class="modal fade" id="myModal"> <div class="modal-dialog"> <div class="modal-content"> <!-- 模态框头部 --> <div class="modal-header"> <h4 class="modal-title">内容</h4> <button type="button" class="close" data-dismiss="modal">×</button> </div> <!-- 模态框主体 --> <div class="modal-body"> </div> <!-- 模态框底部 --> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button> </div> </div> </div> </div> </div> </body> </html> <script type="text/javascript"> function shoujian(){ $.ajax({ type:"post", url:"xitongchuli.php", async:true, data:{ type:"type" }, dataType:"json", success:function(data){ frist(data); } }); } function frist(data){ var str = ""; str += "<table width='100%'>"; str += "<tr><td>序号</td><td>寄件人</td><td>收件人</td><td>时间</td><td>内容</td><td>阅读状态</td></tr>"; for(var i=0;i<data.length;i++){ str +="<tr>"; for(var j=0;j<data[i].length;j++){ if(data[i][5]=='0'){ data[i][5] = "未读"; }else if(data[i][5]=='1'){ data[i][5] = "已读"; } str+="<td>"+data[i][j]+"</td>"; } str += "<td><button type='button'data-toggle='modal' data-target='#myModal' onclick='dian(""+data[i][0]+"",""+data[i][4]+"")'>查看</button></td>" str +="</tr>"; } str += "</table>"; $(".neirong").html(str); } function dian(bb,aa){ $(".modal-body").html(aa); $.ajax({ type:"post", url:"xitongchuli.php", async:true, data:{ type:"yuedu", bb:bb }, dataType:"json", success:function(data){ frist(data); } }); } </script>
接下来是系统的处理页面
<?php session_start(); $type =$_POST['type']; $conn = new mysqli("localhost","root","","ceshi3"); $conn->connect_error?die("链接失败"):""; switch($type){ case"type": $name = $_SESSION["name"]; $sql = "select * from liuyan where Recever = '{$name}' or Recever='all'" ; $result = $conn->query($sql); $attr =$result->fetch_all(); echo json_encode($attr); break; case"yuedu": $bb = $_POST['bb']; $sql = "update liuyan set states = 1 where Ids = '{$bb}'"; $result = $conn->query($sql); // $attr =$result->fetch_all(); $name = $_SESSION["name"]; $sql = "select * from liuyan where Recever = '{$name}' or Recever='all'"; $result = $conn->query($sql); $attr = $result->fetch_all(); echo json_encode($attr); break; } ?>
最后这是一个退出页面：返回登录页面
<?php session_start(); unset($_SESSION["uid"]); header("location:zhuye.php"); ?>
最后 一个注册的验证：
<!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" /> <link rel="stylesheet" type="text/css" href="../bootstrap-3.3.7-dist/css/bootstrap.min.css"/> <script src="../0614/public/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script> <script src="../bootstrap-3.3.7-dist/js/bootstrap.min.js" type="text/javascript"></script> <title>Document</title> </head> <body> 注册账号：<input id="username" type="text" /> 密码：<input id="mima" type="text"/> <button onclick="tianjia()">提交</button> </body> <script type="application/javascript"> //当密码框获得焦点时，触发的事件 $("#mima").focus(function(){ var username = $("#username").val(); if(username == ""){ alert("不能为空"); }else { $.ajax({ type:"POST", url:"yanzheng.php", data:{ username:username, }, dataType:"TEXT", success:function(data){ //alert(data); if(data != 0){ $("#username").focus();//重新让用户名输入框获得焦点 alert("该账号已被注册"); } } }); } }) function tianjia(){ } </script> </html>
输入用户名时 实时后台数据监测用户名是否被占用；下面是处理页面
<?php $username =$_POST['username']; $conn =new mysqli("localhost","root","","ceshi3"); $conn->connect_error?die("链接失败"):""; $sql = "select count(*) from yuangong where UserName = '{$username}'"; $result = $conn->query($sql); $attr = $result->fetch_all(); echo $attr[0][0]; ?>