1、首先我们做一个前台的注册页面
用户登录margin:0px;
padding:0px;
background-color: #CCCCCC;
}.panel{
width:380px;
height:420px;
position:absolute;
left: 50%;
margin-left: -190px;
top: 50%;
margin-top: -210px;
}.form-horizontal{
padding:10px 20px;
}.btns{
display:flex;
justify-content:center;
}
$("#submit").on("click",function(){var userName = $("input[name='userName']").val();var pwd = $("input[name='pwd']").val();var rePwd = $("input[name='rePwd']").val();var realName = $("input[name='realName']").val();if(userName==""||pwd==""||rePwd==""||realName==""){
alert("所有信息不可为空,请确认!");return;
}else if(pwd!=rePwd){
alert("两次密码输入不一致!");return;
}
$.post("doReg.php",{"userName":userName,
"pwd":pwd,
"realName":realName
},function(data){
alert(data);if(data=="注册成功"){
location= "login.php";
}
})
});
});
注:通过Ajax向后台请求数据
2、然后是后台操作
header("Content-Type:text/html;charset=utf-8");
include_once("mysqlshujuku.php");
$userName = $_POST["userName"];
$pwd = $_POST["pwd"];
$realName = $_POST["realName"];
$searchUserSql = <<
select * from user where username = "{$userName}"
searchUserSql;
$res = mysqli_query($conn, $searchUserSql);
if($row = mysqli_fetch_row($res)){
die("用户名已注册");
}
$insertUserSql = <<
insert into yzdl (username,pwd,realname)
values ("{$userName}","{$pwd}","{$realName}");
insertUserSql;
$isOk = mysqli_query($conn,$insertUserSql);
if($isOk){
echo "注册成功";
}else{
echo "注册失败";
}
mysqli_free_result($res);
mysqli_close($conn);
注:这里我们对MySQL数据库中的数据进行了对比,已注册的用户无法注册
3、下面我们再做一个简单的前台登录页面
用户登录——杰瑞教育图书管理系统body{
margin: 0px;
padding: 0px;
background-color: #CCCCCC;
}
.panel{
width: 380px;
height: 280px;
position: absolute;
left: 50%;
margin-left: -190px;
top: 50%;
margin-top: -140px;
}
.form-horizontal{
padding: 10px 20px;
}
.btns{
display: flex;
justify-content: center;
}
$(function(){
$("#submit").on("click",function(){
var userName = $("input[name='userName']").val();
var pwd = $("input[name='pwd']").val();
$.post("doLogin.php",{
"userName":userName,
"pwd":pwd
},function(data){
alert(data);
if(data=="登录成功"){
location = "index.php";
}else{
alert("用户名或密码有误!");
}
});
});
});
注:也是通过的Ajax,这里我们登录成功后直接进入主页
4、登录页的后台
@session_start();include_once("mysqlshujuku.php");$userName = $_POST["userName"];$pwd = $_POST["pwd"];$loginSql = <<
select* from yzdl where username="{$userName}" and pwd = "{$pwd}";
login;$res = mysqli_query($conn, $loginSql);if($row = mysqli_fetch_row($res)){$_SESSION["user"] = $row;echo "登录成功";
}else{echo "登录失败";
}mysqli_free_result($res);mysqli_close($conn);<?phpheader ("Content-Type:text/html;charset=utf-8");
@session_start();include_once("mysqlshujuku.php");$userName = $_POST["userName"];$pwd = $_POST["pwd"];$loginSql = <<
select* from yzdl where username="{$userName}" and pwd = "{$pwd}";
login;$res = mysqli_query($conn, $loginSql);if($row = mysqli_fetch_row($res)){$_SESSION["user"] = $row;echo "登录成功";
}else{echo "登录失败";
}mysqli_free_result($res);mysqli_close($conn);
5、最后是主页,主页的具体内容可以自己补充
我是主页
}else{$str = <<alert("请登陆后操作!");
location= "login.php";js;echo $str;
}?>
这样一个简单的前后台交互登录注册系统就完成了,如有问题请留言。