搜索
博主信息
博文 38
粉丝 1
评论 0
访问量 30096
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
4月24日作业(2) html表单
鲨鱼辣椒的博客
原创
774人浏览过

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>

运行实例 »

点击 "运行实例" 按钮查看在线实例


批改状态:未批改

老师批语:
本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
作者最新博文
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学