第三课设计WEB前端页面（二）

来源：互联网发布：oppo手机4g网络不稳定编辑：程序博客网时间：2024/05/29 02:47

学习目标：熟悉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>

菜单项
以上代码，是本人上课时总结的。如有问题，请及时告诉博主，谢谢！

0 0

第三课 设计WEB前端页面 （二）

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

第三课设计WEB前端页面（二）