第三课设计WEB前端页面（二）_web开发原始密码不为空怎么设置的-CSDN博客

本文链接：https://blog.csdn.net/xiaopei5200/article/details/50958453

学习目标：熟悉PHP语法规则、编码方法和HTML页面简单设计

1.用户名和密码的验证。
（1）当没有输入密码、用户名，提示用户名和密码不能为空。
（2）当输入后，提示你输入的密码和用户名是什么。
登陆设计图
提示以上两个功能：
Post：隐藏式，的所有人看不到具体信息。
Get：开放式，所有人都看到。
多数情况下使用post，比较安全。
编码如下：

<html>
    <head>
        <title>用户名和密码验证</title>
    </head>
    <body>
        <form id="form1" name="form1" method="post">
            <tr>
                <td height="35" align="center" class="STYLE1">用户名
                    <input name="user" type="text" size="16"/>
                </td>
            </tr>
            <tr>
                <td height="35" align="center" class="STYLE1">密码
                    <input name="password" type="password" size="16"/>
                </td>
            </tr>
            <tr>
                <td height="35" align="center"><input type="submit" name="Submit" value="登陆"/></td>
            </tr>
        </form>
        <?php 
        if(isset($_POST['Submit']))
        {
            $user=$_POST['user'];
            $password=$_POST['password'];
            if(empty($user)||empty($password))
            {
                echo "<script>alert('用户名和密码不能为空');window.location.href='UserPass.php';</script>";
            }else{
                echo "输入的用户名为:$user,输入的密码为:$password<br/>";
            }
        }

        ?>
    </body>
</html>

效果图：
登陆图
提示图
登陆输出图
在上一个文件的基础上又添加了一些菜单项，代码如下：

<html>
    <head>
        <title>用户名和密码验证</title>
    </head>
    <body>
        <form id="form1" name="form1" method="post">
            <br>
                <td height="35" align="center" class="STYLE1">用户名：
                    <input name="user" type="text" size="16"/>
                </td>
            </br>
            <br>
                <td height="35" align="center" class="STYLE1">密码：
                    <input name="password" type="password" size="16"/>
                </td>
            </br>
            <br>
                <td height="35" align="center" class="STYLE1">性别：
                    <select name="sex">
                    <option>女</option>
                    <option>男</option>
                    </select>
                </td>
            </br>
            <br>
                    <td height="35" align="center" class="STYLE1">邮箱：
                        <input name="email" type="text" size="36"/>
                    </td>
            </br>
            <br>
                <td height="35" align="center" class="STYLE1">手机：
                    <input name="phone" type="text" size="12"/>
                </td>
            </br>
            <br>
                <td height="35" align="center" class="STYLE1">地址：
                    <input name="adr" type="text" size="45"/>
                </td>
            </br>   
            <br>
                <td height="35" align="center"><input type="submit" name="Submit" value="登陆"/></td>
            </br>
        </form>
        <?php 
        if(isset($_POST['Submit']))
        {
            $user=$_POST['user'];
            $password=$_POST['password'];
            $sex=$_POST['sex'];
            $email=$_POST['email'];
            $phone=$_POST['phone'];
            $adr=$_POST['adr'];
            if(empty($user)||empty($password)||empty($sex)||empty($email)||empty($phone)||empty($adr))
            {
                echo "<script>alert('用户名和密码不能为空');window.location.href='UserPass.php';</script>";
            }else{
                echo "你的用户名为:$user,<br/>";
                echo "你的密码为:$password,<br/>";
                echo "你的性别为:$sex,<br/>";
                echo "你的邮箱为:$email,<br/>";
                echo "你的手机为:$phone,<br/>";
                echo "你的地址为:$adr,<br/>";

            }
        }

        ?>
    </body>
</html>