2. 独立完成一个用户注册表单
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>简单用户登录首页</title> </head> <body> <div> <form action="phpcn.php" method="get"> <p> <label for="username">账号</label> <input type="text" name="username" id="username" onkeyup = "value=value.replace(/[^\d]/g,'')" placeholder="不能低于8位数字"> </p> <p> <label for="username">密码</label> <input type="password" name="pwd" id="pwd" placeholder="6-12的字母和数字组成"> </p> <p> <label for="username">确认密码</label> <input type="password" name="pwd" id="pwd" placeholder="请再次确认密码"> </p> <p> <label for="email">邮箱:</label> <!-- required: 必填项--> <input type="email" id="email" name="email" placeholder="example@mail.com" required> </p> <p> <label for="age">年龄</label> <input type="number" name="age" id="age" min="16" max="18"> </p> <p> <label for="birthday">生日</label> <input type="date" name="birthday" id="birthday"> </p> <!--单选按钮--> <p> <label for="male">性别</label> <input type="radio" name="gender" value="male" id="male"><label for="male">男生</label> <input type="radio" name="gender" value="female" id="female"><label for="female">女生</label> <!--checked 默认值--> <input type="radio" name="gender" value="ladyboy" id="ladyboy" checked><label for="ladyboy">人妖</label> </p> <!--复选框 多选框--> <p> <label for="programme">爱好: </label> <!--点击"爱好"标签会自动定位到"撸代码"选项上--> <input type="checkbox" name="hobby[]" value="game" id="game"><label for="game">打游戏</label> <input type="checkbox" name="hobby[]" value="programme" id="programme"><label for="programme">撸代码</label> <input type="checkbox" name="hobby[]" value="music" id="music"><label for="programme">音乐</label> <!-- checked: 默认值--> <input type="checkbox" name="hobby[]" value="programme" id="movies" checked><label for="movies">PHP</label </p> <p> <!--select: 下拉列表,也叫下拉框--> <label for="region">地区</label> <select name="region" id="region" size="1"> <optgroup label="地球:"> <option value="0">请选择</option> <option value="1">中国</option> <option value="2">美国</option> <option value="3">台湾</option> <option value="4">***鬼子</option> </optgroup> <optgroup label="中国:"> <option value="5">北京</option> <option value="6">上海</option> <option value="7">深圳</option> <option value="8">长沙</option> </optgroup> </select> </p> <!--文本域--> <p> <label for="comment">简介:</label> <textarea name="comment" id="comment" cols="30" rows="5" maxlength="30" placeholder="内容不能超过30个字符"></textarea> </p> <!--按钮--> <p> <!--提交按钮--> <input type="submit" name="submit" value="提交"> <!--重置按钮--> <input type="reset" name="reset" value="重置"> <!--普通按钮, 没有具体的功能,--> <input type="button" name="button" value="按钮"> <!--button提交按钮--> <button>提交1</button> <button type="submit">提交2</button> </p> </form> </div> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例