php 登录注册

先看图片

QQ截图20210625162058.png

sql

CREATETABLE`users`(`user_id`int(11)NOTNULLAUTO_INCREMENT,`username`varchar(255)COLLATEutf8_unicode_ciDEFAULTNULLCOMMENT'用户名',`email`varchar(255)COLLATEutf8_unicode_ciDEFAULTNULLCOMMENT'邮箱',`password`varchar(255)COLLATEutf8_unicode_ciDEFAULTNULLCOMMENT'密码',`sex`varchar(255)COLLATEutf8_unicode_ciDEFAULTNULLCOMMENT'性别',`hobby`varchar(255)COLLATEutf8_unicode_ciDEFAULTNULLCOMMENT'爱好',`avatar`varchar(255)COLLATEutf8_unicode_ciDEFAULTNULLCOMMENT'头像',`remark`varchar(255)COLLATEutf8_unicode_ciDEFAULTNULLCOMMENT'备注',PRIMARYKEY(`user_id`))ENGINE=InnoDBAUTO_INCREMENT=6DEFAULTCHARSET=utf8COLLATE=utf8_unicode_ci;

注意mysqli_connect('127.0.0.1','root','123456','jin'); 根据自己的数据库链接来 127.0.0.1 是服务器，root:数据库账号，123456：数据密码，jin是数据库

背景页面地址请换成自己的

登录代码

<?php$post=$_POST;if($post){session_start();$con=mysqli_connect('127.0.0.1','root','123456','jin');if(!$con){die("数据库链接失败:".mysqli_connect_error());}$sql="SELECT*FROMusersWHEREusername={$post['username']}ANDpassword={$post['password']}";$result=mysqli_query($con,$sql);if(mysqli_num_rows($result)>0){$row=mysqli_fetch_assoc($result);$_SESSION['users']=$row;Header("Location:user_info.php");}else{echo'<script>alert("该账号没有注册或账号密码不匹配")</script>';}}?><!DOCTYPEhtml><html><head><metahttp-equiv="content-type"content="text/html;charset=UTF-8"><metacharset="utf-8"><title>登录页面</title><metaname="keywords"content="Admin"><metaname="description"content="Admin"><metaname="viewport"content="width=device-width,initial-scale=1.0"></head><style>body,html{width:100%;height:100%;}#main{width:100%;height:100%;background:url("./images/login_bg.jpg")no-repeatcentercenter/100%100%!important;}.login{width:500px;background:rgba(255,255,255,.4);position:fixed;left:50%;top:50%;margin-left:-250px;margin-top:-100px;text-align:center;border-radius:20px;}.loginspan{font-size:20px;display:inline-block;width:60px;text-align:right;color:#00ff5d;font-weight:600;margin-top:5px;}.logininput{margin-left:10px;width:300px;height:30px;}.loginp{margin-top:20px;}.loginh1{margin-top:10px;color:#00ff5d;}.loginbutton{width:100px;height:40px;font-size:15px;background:#007aff;color:#fff;border:none;border-radius:10px;margin-top:20px;}</style><bodyclass="login-page"><divid="main"><divclass="login"><formaction=""id="altForm"method="post"><h1>管理系统</h1><p><span>账号</span><inputtype="text"name="username"value=""></p><p><span>密码</span><inputtype="password"name="password"value=""></p></form><buttonid="btn_login"style="margin-bottom:10px;">登录</button><buttonid="btn_login"style="background:#767679;"onclick="window.location.href='register.php'">注册</button></div></div><scriptsrc="js/jquery-3.3.1.min.js"></script><scripttype="text/javascript">$('#btn_login').click(function(){if($('input[name="username"]').val()==''){msg('请先输入账号');returnfalse;}if($('input[name="password"]').val()==''){msg('请先输入密码');returnfalse;}$('#altForm').submit();})</script></body></html>

注册页面代码

<?php$post=$_POST;if($post){$con=mysqli_connect('127.0.0.1','root','123456','jin');if(!$con){die("数据库链接失败:".mysqli_connect_error());}$sql="SELECTuser_idFROMusersWHEREusername={$post['username']}";$result=mysqli_query($con,$sql);if(mysqli_num_rows($result)>0){echo'<script>alert("用户账号已经注册，请更换账号")</script>';}else{$file=$_FILES['file'];if($file){$path='/upload/'.date('Ymd');if(!file_exists($path)){//判断有没有目录，没有目录那就创建目录mkdir('.'.$path,'0777',true);//创建目录并设置目录为可读，可写，可执行}$name=explode('/',$file['type'])[1];//获取文件后缀$name=md5(rand('1000,9999').date('Y-m-dH-i-s',time())).'.'.$name;//创建一个新的图片名字图片名字有1000-9999的随机数+当前时间戳move_uploaded_file($file["tmp_name"],'./'.$path.'/'.$name);//将文件移动至指定目录$post['url']=$path.'/'.$name;$sql="INSERTINTOusers(username,email,password,sex,hobby,avatar,remark)VALUE('{$post['username']}','{$post['email']}','{$post['password']}','{$post['sex']}','{$post['hobby']}','{$post['url']}','{$post['remark']}')";$result=mysqli_query($con,$sql);mysqli_close($con);Header("Location:login.php");}}}?><!DOCTYPEhtml><html><head><metahttp-equiv="content-type"content="text/html;charset=UTF-8"><metacharset="utf-8"><title>登录页面</title><metaname="keywords"content="Admin"><metaname="description"content="Admin"><metaname="viewport"content="width=device-width,initial-scale=1.0"></head><linkrel="stylesheet"href="css/common.css"><style>body,html{width:100%;height:100%;}#main{width:100%;height:100%;background:url("./images/login_bg.jpg")no-repeatcentercenter/100%100%!important;}.login{width:500px;background:rgba(255,255,255,.4);position:fixed;left:50%;top:10%;margin-left:-250px;text-align:center;border-radius:20px;}.loginspan{font-size:20px;display:inline-block;width:60px;text-align:right;color:#00ff5d;font-weight:600;margin-top:5px;}.logininput{margin-left:10px;width:300px;height:30px;}.loginp{margin-top:20px;}.loginh1{margin-top:10px;color:#00ff5d;}.loginbutton{width:100px;height:40px;font-size:15px;background:#007aff;color:#fff;border:none;border-radius:10px;margin-top:20px;}.tx{width:100px;height:100px;border-radius:50%;background:#fff;margin:0auto;overflow:hidden;}.tximg{width:100%;height:100%;}.sex{display:flex;margin-left:60px;}.sexinput{width:20px;}</style><bodyclass="login-page"><divid="main"><divclass="login"><formaction=""id="altForm"method="post"enctype="multipart/form-data"><h1>管理系统</h1><divclass="tx"></div><pstyle='color:#00ff5d;'>请上传头像</p><inputtype="file"name="file"id="file"style='display:none;'accept="image/*"><p><span>账号：</span><inputtype="text"name="username"value=""></p><p><span>密码：</span><inputtype="password"name="password"value=""></p><p><span>邮箱：</span><inputtype="text"name="email"value=""></p><divclass="sex"><div><span>性别：</span></div><divstyle="display:flex"><labelstyle="font-size:23px;display:flex;color:#00ff5d;"><inputtype="radio"value="1"name="sex"checked>男</label><labelstyle="font-size:23px;display:flex;color:#00ff5d;"><inputtype="radio"value="0"name="sex">女</label></div></div><p><span>爱好：</span><inputtype="text"name="hobby"value=""></p><p><span>备注：</span><textareastyle="width:300px;height:80px;margin-left:5px;"name="remark"></textarea></p></form><buttonid="btn_login"style="margin-bottom:10px;">注册</button><buttonid="btn_login"style="background:#767679;"onclick="window.location.href='index.php'">登录</button></div></div><scriptsrc="js/jquery-3.3.1.min.js"></script><scriptsrc="js/common.js"></script><scripttype="text/javascript">$('.tx').click(function(){$('#file').trigger('click');})$('#file').change(function(){varobjUrl=getObjectURL(this.files[0]);if(objUrl){$('.tx').html('<imgsrc="'+objUrl+'"alt="">');}});$('#btn_login').click(function(){if(!$('#file').val()||$('#file').val()==''){msg('请先上传图片');returnfalse;}if($('input[name="email"]').val()==''){msg('请先输入账号');returnfalse;}if($('input[name="password"]').val()==''){msg('请先输入密码');returnfalse;}if($('input[name="password"]').val()==''){msg('请先输入邮箱');returnfalse;}if($('input[name="hobby"]').val()==''){msg('请先输入爱好');returnfalse;}if($('input[name="remark"]').val()==''){msg('请先输入备注');returnfalse;}$('#altForm').submit();})</script></body></html>

js/common.js

//上传图片回显百度的functiongetObjectURL(file){varurl=null;if(window.createObjectURL!=undefined){//basicurl=window.createObjectURL(file);}elseif(window.URL!=undefined){//mozilla(firefox)url=window.URL.createObjectURL(file);}elseif(window.webkitURL!=undefined){//webkitorchromeurl=window.webkitURL.createObjectURL(file);}returnurl;}functionmsg(content,time=2000){$('body').append('<divclass="quanMsg">'+content+'</div>');if(time>0){setTimeout(function(){$('body').find('.quanMsg').remove();},time)}}

css/common.css

.quanMsg{width:200px;padding:10px;text-align:center;background:rgba(0,0,0,.5);position:fixed;top:40%;left:50%;margin-left:-100px;color:#fff;border-radius:5px;}

jquery 自己去官网下载一个

更多相关文章

随机推荐