　　（二）小白实现了注册操作，如图，代码在下面（实现登录在上一篇）

二、实现注册

1.布局：

lable{display:inline-flex;width:30px;height:30px;} //能实现输入框的自动对齐，否则会参差不齐。

2.思路

a)验证数据合理性：

　　　 1.在表单提交时(onsubmit属性),通过JS中的document.getElementById(“id”).value获取账号密码

　　　 2.用str.trim()==‘’确认不为空，str.indexOf (“ ”)判断用户名不含空格

　　　 pwd1 == pwd2判断两密码相同，pwd.length<8判断密码长度不小于8

　　 3.如上有一个不满足则alert,并返回false,不让提交

b)验证用户名是否重复：

　　　　通过表单中的name属性post到后台regist_judge）,使用$_POST[‘name’]获取提交表格的值，通过$mysqli_result = db->query(“sql查找语句”)存储db数据库中表格的信息，在while中通过$row = $mysqli_result(fetch_array(MYSQL_ASSOC))获取第一条信息　　　　（3->2->1），用$row[‘user’] == $username判断用户名是否在数据库中已经存在

　　　　i) 重复：

　　　　　　header()指向登录界面，并通过$_SESSION[‘flag’]传递注册失败信息，用来在注册界面alert（用户登录失败信息）；

　　　　ii）不重复：

　　　　 if($judge = $db->query($sql插入语句)===true)//插入成功echo生成a标签用来跳转至登录界面

c)用户名重复处理：

　　　　在后台返回注册界面后，使用if（isset($_SESSION[‘flag’])）判断是否存在flag，存在则说明用户名重复，echo JS中的alert();并且使用unset($_SESSISON[‘flag’])摧毁它

代码

regist.php//注册界面

<?php
    session_start();

    if(isset($_SESSION['flag']) ){
        echo "<script type='text/javascript'>alert('用户名已存在')</script>";
        unset($_SESSION['flag']);
    }

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>注册</title>
    <style type="text/css">
        label{width:80px;display:inline-flex;height:30px;}
        .registall{border:10x solid pink;width:600px;height:300px;margin:200px auto;border:2px solid pink;box-shadow:0 0 5px 0 #aaa; border-radius:30px;}
        .regist .submit{position:relative;left:115px;top:10px;width:75px;height:27px;}
        .regist {width:300px;margin:20px auto;}
        .registall .title{font-size:23px;color:pink;text-align:center;margin-bottom:20px;margin-top:38px;}
    </style>
    <script type="text/javascript">
    
        function judge(){
            var username = document.getElementById("username").value;
            var password1 = document.getElementById("password1").value;
            var password2 = document.getElementById("password2").value;
            /*判断数据合法*/
            if(username == ''||username.trim()=='') alert("用户名不能为空");
            else if(username.indexOf(" ")!=-1)    alert("用户名不能含有空格");
            else if(password1 == ''||password2==''||password1.trim()==''||password2.trim()=='')
                alert("密码不能为空");
            else if(password1 != password2)
                alert("两个密码必须一致");
            else if(password1.length<8) alert("密码长度不能少于8");
            else return true;
            return false;
        }
    </script>
</head>
    
<body>
    <div class="registall" >
        <div class="title">注册界面</div>
        <form class="regist" action="regist_judge.php" method="post" onsubmit="return judge();">
            <label>用户名:</label>          
            <input id="username"  name = "username" type="text" placeholder="输入您的用户名"/ ></br>
            <label>密码:</label>          
            <input id="password1" name = "password1" type="password" placeholder="密码的长度超过6"/></br>
            <label>确认密码：</label>     
            <input id="password2" name = "password2" type="password" placeholder="请再次输入密码"/></br>
            <input type="submit" value="注册" class="submit"/>
        </form>
     </div>

</body>
</html>

regist_judge.php//登录判断界面

<?php
    session_start();
    include("connect.php");
    $username = $_POST["username"];
    $password1 = $_POST["password1"];
    $password2 = $_POST["password2"];
    $sql_judge = "select username from user_msg where username='{$username}'";
    $mysqli_result = $db->query($sql_judge);
    while($row = $mysqli_result->fetch_array(MYSQL_ASSOC)){
　　　　 /*判断用户名是否存在*/
        if($row['username'] == $username){
            $_SESSION['flag']=1;
            header("location:regist.php");
            exit();
        }
    }
    $sql = "insert user_msg(username, password) values('{$username}','{$password1}')";
　　//插入数据库
    if($judge = $db->query($sql)===true){
        echo "<br/><div style='text-align:center;'>注册成功<br/><br/> <strong>
        <a href='login.php' style='text-decoration:none;font-size:20px;color:pink;'> 登录</a></strong></div>";
    }
            
?>

能登录注册的留言板(2)——实现注册

二、实现注册

1.布局：

2.思路

代码

regist.php//注册界面

regist_judge.php//登录判断界面

猜你喜欢