案例效果:
评分标准:
- 在站点下创建day5_exam目录,存放考试所需文件(5分)
- 对以下PHP程序加入合理注释(5分)
- DIV+CSS布局美化网页(35分)
- 参考网址:通用的会员注册表单验证ui布局
- 设置整个网页背景颜色(5分)
- 设置定位,让注册页面位于页面正中央(5分)
- 设置注册页面的宽、高、背景颜色(5分)
- 设置表单元素(5分)
- 设置提交按钮的样式(5分)
- 设置表单中的填充(5分)
- 给文本框增加提示信息(5分)
- PHP接收处理数据(55分)
- 表单的提交地址设置为:show.php页面,提交方式为post(5分)
- 接收表单提交的数据(5分)
- 验证不能为空,为空返回到表单页面(5分)
- 验证邮箱是合格的邮箱,带有@符号的(5分)
- 验证密码是6-8位的纯数字(5分)
- 验证密码和确认密码是一致的(5分)
- 将提交的数据输出在页面上(5分)
- 独占一行输出(5分)
- 输出的内容加粗显示(5分)
- 输出的内容字体颜色为红色(5分)
- 输出的内容字体大小为20px(5分)
<?php ?> <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <!-- 引入 Bootstrap --> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> </head> <style> * { margin: 0 auto; padding: 0; padding-left: 20px; } .box { width: 600px; height: 500px; background-color: #fff; } .box button { background-color: blueviolet; width: 300px; color: #ffffff; padding-left: 20px; border: none; } </style> <body style="background-color:blueviolet;"> <div class="box"> <h4>注册会员</h4> <form action="show.php" method="post" enctype="multipart/form-data"> <div class="form-group"> <label for="exampleInputEmail1">姓名</label> <input type="text" class="form-control" name="name" id="regName" placeholder="请输入姓名"> </div> <div class="form-group"> <label for="exampleInputPassword1">邮箱</label> <input type="text" class="form-control" name="email" id="exampleInputPassword1" placeholder="请输入邮箱"> </div> <div class="form-group"> <label for="exampleInputPassword1">密码</label> <input type="password" class="form-control" name="pass" id="exampleInputPassword1" placeholder="请输入密码"> </div> <div class="form-group"> <label for="exampleInputPassword1">确认密码</label> <input type="password" class="form-control" name="passWord" id="exampleInputPassword1" placeholder="请确认密码"> </div> <button type="submit" class="btn btn-primary">提交</button> </form> </div> </body> </html>
<?php print_r($_POST); $name = $_POST['name'];//姓名 $email = $_POST['email'];//邮箱 $pass = $_POST['pass'];//密码 $passWord = $_POST['passWord'];//确认密码 //姓名 if (empty($name)) { echo "<font style='font-size: 20px; font-weight: bold;>alert('姓名不能为空');window.history.back()</font>"; die(); } $regName = "/^[\x{4e00}-\x{9fa5}]{2,4}$/u"; if (!preg_match($regName, $name)) { echo "<script style='font-size: 20px; font-weight: bold; color: red;>alert('请输入2-3位汉子' );window.history.back()</script>"; die(); } //邮箱 if (empty($email)) { echo "<script style='font-size: 20px; font-weight: bold; color: red;>alert('邮箱不能为空');window.history.back()</script>"; die(); } $regEmail = "/^\w+@\w+(\.)\w+$/"; if (!preg_match($regEmail, $email)) { echo "<script style='font-size: 20px; font-weight: bold; color: red;>alert('请正确输入邮箱');window.history.back()</script>"; die(); } //密码 if (empty($pass)) { echo "<script style='font-size: 20px; font-weight: bold; color: red;>alert('密码不能为空');window.history.</script>"; die(); } $regPass = "/^\w{6,18}$/"; if (!preg_match($regPass, $pass)) { echo "<script style='font-size: 20px; font-weight: bold; color: red;>alert('请输入6-18位密码');window.history.back()</script>"; die(); } //确认密码 if (empty($passWord)) { echo "<script style='font-size: 20px; font-weight: bold; color: red;>alert('确认密码不能为空');window.history.back()</script>"; die(); } if ($passWord != $pass) { echo "<script style='font-size: 20px; font-weight: bold; color: red;>alert('两次密码不一致');window.history.back();</script>"; die(); } ?>