PHP实现用户登录注册功能

初学php做了一些比较常见且有用的页面，放在上面记录一下咯
我是用了bootstrap框架里面的模态框做注册登陆页面，这样页面比较美观
页面效果：

注册成功条件/功能：
1）用户名不能冲突

2）两次密码必须相同

3）用户注册数据添加进数据库
4）注册/登录成功之后，用户自动登录

HTML代码：

<link href="http://www.likecs.com/css/bootstrap.css"> <li><a data-toggle="modal" href="#loginer">登录</a></li> <li><a data-toggle="modal" href="#register">注册</a></li> <li><a href="##"></a></li> <li><a href="##">注销</a></li> //登录模态框 <div tabindex="-1" role="dialog" aria-labelledby="myModalLabel1" aria-hidden="true"> <div> <div> <div> <button type="button" data-dismiss="modal"> <span aria-hidden="true">&times;</span><span>Close</span></button> <h4>请登录</h4> </div> <form> <div> <div> <label for="zh1">用户名：</label> <div> <input type="text" pattern="\w{6,10}" required> </div> </div> <div> <label for="pw1">密码：</label> <div> <input type="password" pattern="\w{6,10}" required> </div> </div> <div> <label for="yzm">验证码：</label> <div> <input type="text" pattern="\d{4}" required> </div> <div> <img src="http://www.likecs.com/php/idcode.php" alt=""> </div> </div> <div> <label></label> </div> </div> <div> <button type="submit">登录</button> <button type="button" data-dismiss="modal">关闭</button> </div> </form> </div> </div> </div> //注册模态框 <div tabindex="-1" role="dialog" aria-labelledby="myModalLabe2" aria-hidden="true"> <div> <div> <div> <button type="button" data-dismiss="modal"> <span aria-hidden="true">&times;</span><span>Close</span></button> <h4>请注册</h4> </div> <form> <div> <div> <label for="zh2">用户名：</label> <div> <input type="text" pattern="\w{6,10}" required> </div> </div> <div> <label for="pw2">密码：</label> <div> <input type="password" pattern="\w{6,10}"> </div> </div> <div> <label for="pw3">确认密码：</label> <div> <input type="password" pattern="\w{6,10}"> </div> </div> <div> <label for="lc">昵称：</label> <div> <input type="text" pattern="\S{2,10}"> </div> </div> <div> <label></label> </div> </div> <div> <button type="submit">注册</button> <button type="button" data-dismiss="modal">关闭</button> </div> </form> </div> </div> </div>

JS代码：

<script src="http://www.likecs.com/js/jquery-2.1.3.js"></script> <script src="http://www.likecs.com/js/bootstrap.min.js"></script> <script> function toggle(){ $.getJSON("php/get.php",function (res) { //获取当前用户是否登录 if(res['flag']){//用户已经登录，显示昵称和注销选项 $('li.toggle').toggleClass('hidden'); $('#nicheng').html(res['nc']) } }); } $('#form_login').submit(function (e) {/*登录*/ e.preventDefault();/*阻止表单默认事件，页面全局刷新*/ var data=$('#form_login').serialize();/*将表单里的数据包装起来*/ $.getJSON('php/login.php',data,function (res) { /*data：将表单里的数据传给php，回调函数接受php返回来的值*/ if(res==3){//用户名、密码、验证码都输入正确 toggle();/*修改首页选项菜单*/ $('#loginer').modal('hide');/*关闭模态框*/ }else if(res==2){ $('#info').html('用户名或密码有误') }else { $('#info').html('验证码有误') } }) }); $('#logout').click(function () { confirm('确定要注销？'); $.getJSON('php/logout.php',function (res) { if(res)toggle(); }) }) $('#form_regist').submit(function (e) { e.preventDefault(); var data=$('#form_regist').serialize(); $.getJSON('php/regist.php',data,function (res) { if(res==3){ toggle(); $('#register').modal('hide'); }else if (res==2) { $('#wanner').html('两次密码不一致，请重试！') }else if (res==1) { $('#wanner').html('用户名冲突，请重试！') } }) });

connect.php(连接数据库)：

<?php $link=new PDO("mysql:host=localhost;port=3306;dbname=db","root",""); $link->query("set names utf8");