基于php+mysql实现多用户登录

最新推荐文章于 2024-09-11 00:04:15 发布

落尽繁花.终是梦

最新推荐文章于 2024-09-11 00:04:15 发布

阅读量1.7k

点赞数 5

分类专栏： PHP MySQL 登录注册文章标签： php mysql javascript

本文链接：https://blog.csdn.net/m0_50128948/article/details/124965495

版权

这篇博客详细介绍了如何使用PHP和MySQL构建一个多用户登录系统。内容包括登录界面(index.php)、登录处理页(login.php)、随机验证码的生成(code.php)、用户注册界面(register.php)及其处理页(dealregister.php)，并展示了相关代码片段和效果。通过这个系统，用户可以进行注册和登录操作。

摘要由CSDN通过智能技术生成

PHP+MySQL实现多用户注册登录

1.登录界面代码（index.php）

1.1代码：

<?php session_start(); ?>
<html>
<head>
<meta charset="utf-8">
<title>登录首页</title>
<style type="text/css">
label{
   
	font-family: 'Microsoft YaHei';
}
body{
   
//这是背景图
	background: url("../images/index2.png");
	background-repeat: no-repeat;
	background-size: 100% 100%;
}
table{
   
	background-color: #66CCFF;
	width: 490px;
	height: 260px;
	margin-top: 260px;
	font-family: "仿宋";
}
table  tr td input{
   
	padding: 0;
	margin: 0;
	font-family: "仿宋";
}
input{
   
	border-radius: 8px;
	border-style: solid;
}
.shengfen{
   
	margin: right;
}
select{
   
	font-family: "仿宋";
}
option{
   
	font-family: "仿宋";
}
option:hover{
   
	background-color:#008015;
}
.al2{
   
	text-align: right;
	vertical-align:right;
}
.ali{
   
	text-decoration: none;
}
.ali:hover{
   
	background-color:#008015;
}
.tad1{
   
	font-size: 24px;
}
.acil2{
   
	width:200px;
	background-color:#008015;
	color:#fff;"
}
.acil2:hover{
   
	background-color: #007521;
}
</style>
//该部分使用引用实现验证码登录
<script type="text/javascript">
			function myfresh(){
   
		document.getElementById("myid").src="./code.php";
	}
		</script>
		//此处是引用的一部分js效果，js源码放在文章末
<script type="text/javascript" src="../js/formsript.js">

</script>
</head>
<body>
<center>
<form name="form1" method="post" action="login.php" onsubmit="return check_submit()">
<table cellspacing="0" cellpadding="5">
<tr>
<td colspan="3" align="center" class="tad1">****登录*****</td>
</tr>
<tr>
<td>用户名:</td>
<td><input type="text" name="uname" placeholder="请输入用户名" 
	onblur="blur_username()" onfocus="focus_username()"></td>
	<td width="120"><div id="result_name"></td>
	//<td width="120"><div id="result_name"></td>该部分是提示该输入框输入的问题实时显示
</tr>
<tr>
<td>密码:</td>
<td><input type="password" name="upass" placeholder="请输入密码"
	onblur="blur_userpwd()" onfocus="focus_userpwd()"></td>
	<td width="100"><div id="result_pwd"></td>
</tr>
<tr>
<td>验证码:</td>
<td>
<input type="text" name="ucode" placeholder="请输入验证码" >
<img id="myid" src="./code.php" alt="刷新验证码" onclick="myfresh()" style="position:absolute;margin-top:1px;border-radius:8px;">
</td>
</tr>
<tr class="shengfen">
<td>请选择身份：</td>
<td style="size:80px;">
<select name="utype">
<option value="0">---请选择---</option>
<option value="1">普通用户</option>
<option value="2">专家用户</option>
<option value="3">管理员用户</option>
</select>
</td>
</tr>
<tr>
<td colspan="3" align="center" cellpadding>
<input type="submit" value="登录" class="acil2">
</td>
</tr>
<tr>
<td class="al2" colspan="3"  align="left" width="200px"><a href="register.php" value="没有账号，点此注册" class="ali">没有账号，点此注册</a></td>
</tr>	
</table>
</form>
</center>
</body>
</html>

1.2处理登录js(formsript.js)

/*
    表单验证
*/
var flag = flase;   // flag 如果为true（即用户名合法）就允许表单提交， 如果为false（即用户名不合法）阻止提交
var flage = flase;  // flag 如果为true（即密码合法）就允许表单提交， 如果为false（即密码不合法）阻止提交
// 当鼠标聚焦于用户名
function focus_username()
{
   
    // 找到后面的div, id = result_name
    var nameObj = document.getElementById("result_name");
    nameObj.innerHTML = "用户名不能包含特殊字符且为5~20位";
    nameObj.style.color="black";
}
// 当鼠标不聚焦于用户名input
function blur_username()
{
   
    // 找到id=result_name的div
    var nameObj = document.getElementById("result_name");
    // 判断用户名是否合法
    var str2 = check_user_name(document.form1.uname.value);
    nameObj.style.color="red";
    if ("该用户名合法" ==  str2)
    {
   
        flag = true;
        nameObj.innerHTML = str2;
    }
    else
    {
   
        nameObj.innerHTML = str2;
    }

}   
// 检查用户名是否合法        合法就返回"该用户名合法"
function check_user_name(str)
{
   
    var str2 = "该用户名合法";
    if ("" == str)
    {
   
        str2 = "用户名不能为空";
        return str2;
    }
    else if ((str.length < 2) || (str.length > 20))
    {
   
        str2 = "用户名必须为2 ~ 20位";
        return str2;
    }
    else if (check_other_char(str))
    {
   
        str2 = "不能含有特殊字符";
        return str2;
    }
    return str2;
}
// 验证用户名是否含有特殊字符
function check_other_char(str)
{
   
    var arr = ["&", "\\", "/", "*", ">", "<", "@", "!"];
    for (var i = 0; i < arr.length; i++)
    {
   
        for (var j = 0; j < str.length; j++)
        {
   
            if (arr[i] == str.charAt(j))
            {
   
                return true;
            }
        }
    }   
    return false;
}
//当鼠标聚焦于密码
function focus_userpwd(){
   
        // 找到后面的div, id = result_pwd
    var nameObj = document.getElementById("result_pwd");
    nameObj.innerHTML = "密码不能包含特殊字符且为6~20位";
    nameObj.style.color="black";
}
//当鼠标不聚焦于密码input