基于PHP MYsql的失物招领网站设计（附源码）
2024-05-24 03:24:23
使用工具：phpstudy、phpstorm、phpstudy自带的phpmyadmin
（如果有想试着开发网站，不妨使用这俩个，方便易上手，零基础也可以）
登录界面
注册界面
首页
其他界面
管理员界面：
代码部分：
登录界面：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>失物招领系统LOST and FOUND</title><style>* {margin: 0;padding: 0;}body {display: flex;justify-content: center;align-items: center;width: 100%;min-height: 100vh;background-image: url("img/bg2.jpeg");background-repeat: no-repeat;background-position: center;background-size: cover;overflow: hidden;}.login {display: flex;justify-content: center;align-content: space-around;flex-wrap: wrap;width: 500px;height: 300px;background-color: rgba(0,0,0,.5);border: 10px;padding: 20px 50px;border-radius: 20px;}.login h1 {/*(0,0,1,1)*/width: 100%;display: flex;justify-content: center;color: #fff;font-size: 30px;}.login .input-box {/*(0,0,2,0)*/display: flex;flex-wrap: wrap;justify-content: center;align-items: center;transform: translateY(-35px);}.login .input-box .input-text {/*(0,0,3,0)*/width: 100%;display: flex;justify-content: center;}.login .input-box .input-text span{/*(0,0,3,1)*/color: white;font-size: 18px;margin-top: 20px;}.login .input-box .input-text input{/*border: 0;*//*(0,0,3,1)*/padding: 6px;border-bottom: 1px solid white;background-color: #ffffff00;border-radius: 2px;color: #fff;margin-top: 20px;}.login .input-box .sign-in .submit{display: flex;justify-content: center;align-items: center;margin-top: 25px;width: 145px;height: 25px;color: #fff;background: linear-gradient(120deg,#ffec8b 0%,#ff6a6a 100%);text-decoration: none;border-radius: 25px;cursor: pointer;}.login .input-box .sign-up {width: 100%;display: flex;justify-content: left ;margin-top: 20px;margin-left: 45px;/*color: white;*/font-size: 15px;/*pointer-events: none;*/}.login .input-box .sign-up a {color: #3498db;text-decoration: none;cursor: pointer;}#sign-up-btn {color: #3498db;text-decoration: none;}</style><script type="text/javascript ">function check(){if(user.username.valueOf ==""){alert("您还没有填写用户名！");user.username.focus();return false;}if(user.password.valueOf ==""){alert("您还没有填写密码！");user.password.focus();return false;}}</script>
</head>
<body><div class="login"><h1>失物招领系统用户登录</h1><div name="user" class="input-box" onsubmit="return check()" ><form name="login" action="signup.php" method="post"><div class="input-text"><span></span><input type="text" placeholder="用户名" name="Sno"></div><div class="input-text"><span></span><input type="password" placeholder="密码" name="password"></div><div class="sign-in" ><input type="submit" class="submit" value="登录"></div><div class="sign-up"><a id="sign-up-btn" href="register.html">立即注册</a></div></form></div></div></body><?PHP
session_start();
header("Content-Type: text/html; charset=utf8");
$Sno = $_POST['Sno'];//post获得用户名表单值
$password = $_POST['password'];//post获得用户密码单值$server="127.0.0.1";//主机的IP地址，你也可以选填127.0.0.1
$db_username="root";//数据库用户名
$db_password="root";//数据库密码$con = mysqli_connect($server,$db_username,$db_password);//链接数据库
mysqli_select_db($con,'lgsystem');//选择数据库（前边已经说是sxu数据库）if ($Sno && $password)
{ //如果用户名和密码都不为空$sql = "select * from user where Uno = '$Sno' and Upassword='".md5($password)."'";//检测数据库是否有对应的username和password的sql$result = mysqli_query($con,$sql);//执行sql$rows=mysqli_num_rows($result);//返回一个数值$sql1 = "select * from manager where Mno= '$Sno' and password='".md5($password)."'";//检测数据库是否有对应的username和password的sql$result1 = mysqli_query($con,$sql1);//执行sql$rows1=mysqli_num_rows($result1);//返回一个数值if($rows){//0 false 1 true$_SESSION['loggedUsername']=$Sno;header("refresh:0;url=welcome.html");//如果成功跳转至welcome.html页面exit;}else if($rows1){$_SESSION['manager']=$Sno;header("refresh:0;url=manage1.php");}else{ echo "<script>alert('用户名或密码错误');location.href='signup.html';</script>";}}
else{//如果用户名或密码有空echo "<script>alert('表单填写不完整');location.href='signup.html';</script>";}//mysqli_close($con);//关闭数据库
?>
注册界面：
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>注册界面</title><style>* {margin: 0;padding: 0;}body {display: flex;justify-content: center;align-items: center;width: 100%;min-height: 100vh;background-image: url("img/bg2.jpeg");background-repeat: no-repeat;background-position: center;background-size: cover;overflow: hidden;}.register {display: flex;justify-content: center;align-content: space-around;flex-wrap: wrap;width: 500px;height: 420px;background-color: rgba(0,0,0,.5);border: 10px;padding: 20px 50px;border-radius: 20px;}.register h1 {/*(0,0,1,1)*/width: 100%;display: flex;justify-content: center;color: #fff;font-size: 25px;}.register .input-box {/*(0,0,2,0)*/display: flex;flex-wrap: wrap;justify-content: center;align-items: center;transform: translateY(-35px);}.register .input-box .input-text {/*(0,0,3,0)*/width: 100%;display: flex;justify-content: center;}.register .input-box .input-text input{border: 0;/*(0,0,3,1)*/padding: 6px;border-bottom: 1px solid white;background-color: #ffffff00;border-radius: 2px;color: #fff;margin-top: 20px;}.register .input-box .submit input {display: flex;justify-content: center;align-items: center;margin-top: 25px;margin-left: 20px;width: 145px;height: 25px;color: #fff;background: linear-gradient(120deg,#ffec8b 0%,#ff6a6a 100%);text-decoration: none;border-radius: 25px;cursor: pointer;}</style>
</head>
<body>
<div class="register"><h1>注册</h1><div name="user" class="input-box" onsubmit="return check()" ><form name="login" action="register.html.php" method="post"><div class="input-text"><span></span><input type="text" placeholder="*用户名" name="sno"></div><div class="input-text"><span></span><input type="text" placeholder="*手机号" name="tnumber"></div><div class="input-text"><span></span><input type="password" placeholder="*设置密码" name="password1"></div><div class="input-text"><span></span><input type="password" placeholder="*确认密码" name="password2"><!-- <input type="text" id="vcode" placeholder="验证码" value="验证码" onfocus="this.value=''" onblur="if(this.value=='')this.value='验证码'" /><span id="code" title="看不清，换一张"></span>-->
<!-- <div id="search_pass_link">--><!-- </div>-->
<!-- <input type="submit" id="submit" value="登录" class="btns" onmouseover="this.style.backgroundColor='#FF8D00'" onmouseout="this.style.backgroundColor='#FC5628'">--><!-- <input type="reset" value="取消" class="btns" onmouseover="this.style.backgroundColor='#FF8D00'" onmouseout="this.style.backgroundColor='#FC5628'">--></div><!-- <div class="back"><a href="signup.html">返回首页</a></div>--><div class="submit"> <input type="submit" value="注册"></div><!-- <canvas id="canvas" width="120" height="40"></canvas>-->
<!-- <input type="text" id="text">-->
<!-- <input type="button" value="提交" id="bt">-->
<!-- <script>-->
<!-- var canvas = document.getElementById("canvas");//演员-->
<!-- var context = canvas.getContext("2d");//舞台，getContext() 方法可返回一个对象，该对象提供了用于在画布上绘图的方法和属性。-->
<!-- var button = document.getElementById("bt");//获取按钮-->
<!-- var input = document.getElementById("text");//获取输入框-->
<!-- draw();-->
<!-- canvas.onclick = function () {-->
<!-- context.clearRect(0, 0, 120, 40);//在给定的矩形内清除指定的像素-->
<!-- draw();-->
<!-- }-->
<!-- // 随机颜色函数-->
<!-- function getColor() {-->
<!-- var r = Math.floor(Math.random() * 256);-->
<!-- var g = Math.floor(Math.random() * 256);-->
<!-- var b = Math.floor(Math.random() * 256);-->
<!-- return "rgb(" + r + "," + g + "," + b + ")";-->
<!-- }-->
<!-- function draw() {-->
<!-- context.strokeRect(0, 0, 120, 40);//绘制矩形（无填充）-->
<!-- var aCode = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "a", "b", "c", "d", "e", "f"];-->
<!-- // 绘制字母-->
<!-- var arr = [] //定义一个数组用来接收产生的随机数-->
<!-- var num //定义容器接收验证码-->
<!-- for (var i = 0; i < 4; i++) {-->
<!-- var x = 20 + i * 20;//每个字母之间间隔20-->
<!-- var y = 20 + 10 * Math.random();//y轴方向位置为20-30随机-->
<!-- var index = Math.floor(Math.random() * aCode.length);//随机索引值-->
<!-- var txt = aCode[index];-->
<!-- context.font = "bold 20px 微软雅黑";//设置或返回文本内容的当前字体属性-->
<!-- context.fillStyle=getColor();//设置或返回用于填充绘画的颜色、渐变或模式，随机-->
<!-- context.translate(x,y);//重新映射画布上的 (0,0) 位置，字母不可以旋转移动，所以移动容器-->
<!-- var deg=90*Math.random()*Math.PI/180;//0-90度随机旋转-->
<!-- context.rotate(deg);// 旋转当前绘图-->
<!-- context.fillText(txt, 0, 0);//在画布上绘制“被填充的”文本-->
<!-- context.rotate(-deg);//将画布旋转回初始状态-->
<!-- context.translate(-x,-y);//将画布移动回初始状态-->
<!-- arr[i] = txt //接收产生的随机数-->
<!-- }-->
<!-- num = arr[0] + arr[1] + arr[2] + arr[3] //将产生的验证码放入num-->
<!-- // 绘制干扰线条-->
<!-- for (var i = 0; i < 8; i++) {-->
<!-- context.beginPath();//起始一条路径，或重置当前路径-->
<!-- context.moveTo(Math.random() * 120, Math.random() * 40);//把路径移动到画布中的随机点，不创建线条-->
<!-- context.lineTo(Math.random() * 120, Math.random() * 40);//添加一个新点，然后在画布中创建从该点到最后指定点的线条-->
<!-- context.strokeStyle=getColor();//随机线条颜色-->
<!-- context.stroke();// 绘制已定义的路径-->
<!-- }-->
<!-- // 绘制干扰点，和上述步骤一样，此处用长度为1的线代替点-->
<!-- for (var i = 0; i < 20; i++) {-->
<!-- context.beginPath();-->
<!-- var x = Math.random() * 120;-->
<!-- var y = Math.random() * 40;-->
<!-- context.moveTo(x, y);-->
<!-- context.lineTo(x + 1, y + 1);-->
<!-- context.strokeStyle=getColor();-->
<!-- context.stroke();-->
<!-- }--><!-- //点击按钮验证-->
<!-- button.onclick = function () {-->
<!-- var text = input.value //获取输入框的值-->
<!-- if (text === num) {-->
<!-- alert('验证通过')-->
<!-- } else {-->
<!-- alert('验证失败')-->
<!-- }-->
<!-- }--><!-- }--><!-- </script>--><!-- </div>-->
<!-- <!– <div class="back"><a href="signup.html">返回首页</a></div>–>-->
<!-- <div class="submit"> <input type="submit" value="注册"></div>-->
<!-- <!– <div class="sign-in-f"><a href="login.html">立即注册</a></div>–>--></form></div>
</div>
</body><script type="text/javascript">var code; //声明一个变量用于存储生成的验证码document.getElementById("code").onclick = changeImg;function changeImg() {var arrays = new Array('1', '2', '3', '4', '5', '6', '7', '8', '9', '0','a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j','k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't','u', 'v', 'w', 'x', 'y', 'z','A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J','K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T','U', 'V', 'W', 'X', 'Y', 'Z');code = ''; //重新初始化验证码//alert(arrays.length);//随机从数组中获取四个元素组成验证码for(var i = 0; i < 4; i++) {//随机获取一个数组的下标var r = parseInt(Math.random() * arrays.length);code += arrays[r];}document.getElementById('code').innerHTML = code; //将验证码写入指定区域}//效验验证码(表单被提交时触发)function check() {//获取用户输入的验证码var input_code = document.getElementById('vcode').value;if(input_code.toLowerCase() == code.toLowerCase()) {//验证码正确(表单提交)return true;}alert("请输入正确的验证码!");//验证码不正确,表单不允许提交return false;}</script>
</html>如有需要，可以联系。。。。
基于PHP MYsql的失物招领网站设计（附源码）相关推荐
- 基于PHP+MySQL+Apache在线考试管理系统（附源码）
作者:BSXY_陈永跃 BSXY_信息学院 注:未经允许禁止转发任何内容 基于PHP+MySQL+Apache在线考试管理系统 项目体验 1.前言 1.1.编写目的 1.2.项目需求 1.3.项目环境 ...
- 原生前端实现响应式个人简历网站设计(附源码)
目录 网站站点 所用技术 实现功能 视频展示 源码 网站站点 胜烨的个人网站 所用技术 HTML css JavaScript 实现功能 响应式界面设计 捕捉用户操作 明暗模式 服务器部署 视频展示 ...
- 基于SSM框架图书管理系统开发与设计(附源码资料)-毕业设计
文章目录 1. 适用人群 2. 你将收获 3.项目简介 4.技术实现 5.系统功能 5.1.管理员身份登录 5.1.1.登录 5.1.2.管理员登录首页 5.1.3.借阅管理 5.1.4.图书管理 5 ...
- java毕业设计高铁站失物招领平台（附源码、数据库）
项目运行 环境配置: Jdk1.8 + Tomcat8.5 + Mysql + HBuilderX(Webstorm也行)+ Eclispe(IntelliJ IDEA,Eclispe,MyEclis ...
- 基于Java学生课外知识学习网站设计实现(源码+lw+部署文档+讲解等)
博主介绍: ✌全网粉丝30W+,csdn特邀作者.博客专家.CSDN新星计划导师.java领域优质创作者,博客之星.掘金/华为云/阿里云/InfoQ等平台优质作者.专注于Java技术领域和毕业项目实战 ...
- 基于JAVA校园失物招领系统计算机毕业设计源码+系统+数据库+lw文档+部署
基于JAVA校园失物招领系统计算机毕业设计源码+系统+数据库+lw文档+部署 基于JAVA校园失物招领系统计算机毕业设计源码+系统+数据库+lw文档+部署 本源码技术栈: 项目架构:B/S架构 开发语 ...
- 基于java“原创音乐爱好者”交流网站计算机毕业设计源码+系统+lw文档+mysql数据库+调试部署
基于java"原创音乐爱好者"交流网站计算机毕业设计源码+系统+lw文档+mysql数据库+调试部署 基于java"原创音乐爱好者"交流网站计算机毕业设计源码+ ...
- 基于JAVA环巢湖区域旅游网站计算机毕业设计源码+数据库+lw文档+系统+部署
基于JAVA环巢湖区域旅游网站计算机毕业设计源码+数据库+lw文档+系统+部署 基于JAVA环巢湖区域旅游网站计算机毕业设计源码+数据库+lw文档+系统+部署 本源码技术栈: 项目架构:B/S架构 开 ...
- JAVA毕业设计Web美食网站设计计算机源码+lw文档+系统+调试部署+数据库
JAVA毕业设计Web美食网站设计计算机源码+lw文档+系统+调试部署+数据库 JAVA毕业设计Web美食网站设计计算机源码+lw文档+系统+调试部署+数据库 本源码技术栈: 项目架构:B/S架构 开 ...
最新文章
- HBase文件索引分析
- Spring Boot 2.0 利用 Spring Security 实现简单的OAuth2.0认证方式1
- 【ACM】nyoj_540_奇怪的排序_201308050951
- php 画虚线,HTML5 Canvas绘制圆点虚线实例_html5教程技巧
- Jupyter 安装并配置工作路径[转]
- android支持色彩管理软件,安卓首家！OPPO全链路色彩管理系统亮相：全局支持10bit照片视频...
- centos 远程安装java程序_centos7远程服务器中redis的安装与java连接
- C语言中 用选择结构编译算法,C语言程序设计立体化教程(高等教育立体化精品系列规划教材)...
- 「今天沾一口野味，明天地府相会！」AI如何抗击「野味肺炎」
- [学习笔记]0/1分数规划
- numpy 基础 —— np.linalg
- python鼠标位置_用python3 返回鼠标位置的实现方法(带界面)
- ubantu删除文件(夹)
- 单片机c51交通灯c语言程序,c51单片机交通灯程序
- 高中计算机教学设计案例分析,高一年级信息技术教学设计(案例)
- Apache-Tomcat-Ajp文件读取漏洞(CVE-2020-1938、CNVD-2020-10487)
- 联合索引的最左匹配原则的成因
- 一文读懂两台计算机之间是如何通信的
- 在线获取外链的php源码,y.qq.com-php获取QQ音乐外链源码
- （新版）一分钟经理人读后感