HTML5-表单中新增的其它属性

最新推荐文章于 2024-07-14 14:30:45 发布

943学前端

最新推荐文章于 2024-07-14 14:30:45 发布

阅读量85

点赞数

分类专栏： HTML5笔记文章标签： html5

本文链接：https://blog.csdn.net/weixin_49924309/article/details/107852539

版权

HTML5笔记专栏收录该内容

16 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <form action="" id="myForm">
        <!--placeholder:提示文本，提示占位  -->
        <!--autofocus：自动获取焦点  -->
        <!-- autocomplete：自动完成：on：打开  off：关闭
        1.必须成功提交过：提交过才会记录
        2.当前添加autocomplete的元素必须有name属性 -->
        用户名：<input type="text" name="userName" placeholder="请输入用户名" autofocus autocomplete="on"> <br>
        <!--tel并不会实现验证，仅仅是在移动端能够弹出数字键盘  -->
        <!--required：必须输入，如果没有输入则会阻止当前数据提交  -->
        <!--pattern：正则表达式验证
        *:任意个
        ?:代表0个或1个
        +：代表1个 或多个  -->
        手机号：<input type="tel" name="userPhone" required pattern="^(/+86)?1\d{10}$"> <br>
        <!-- multiple:可以选择多个文件 -->
        文件：<input type="file" name="photo" multiple> <br>
        <!-- email:有默认验证 在Email中，multiple允许输入多个邮箱地址，以逗号分隔 -->
        邮箱：<input type="email" name="email" multiple> <br>

        <!-- 提交 -->
        <input type="submit"> <br>
    </form>
    <!-- 下面这个表单元素并没有包含在form中：默认情况下表单元素的数据不会进行提交 -->
    <!-- form：指定表单id，那么在将来指定id号的表单进行数据提交的时候，也会将当前表单元素的数据一起提交 -->
    地址: <input type="text" name="address" form="myForm">
</body>

</html>

943学前端

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML5-表单中新增的其它属性

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <form ac
复制链接

扫一扫