前端表单标签input笔记

最新推荐文章于 2023-01-11 02:55:21 发布

乌喵_

最新推荐文章于 2023-01-11 02:55:21 发布

阅读量474

点赞数 1

文章标签： html5 前端

本文链接：https://blog.csdn.net/ha_na_bi_/article/details/127522683

版权

为了收集用户信息

由表单域、表单控件、提示信息组成

from用于定义表单域

放在form里面 input type=“相关属性”

checkbox 多选

radio 单选这里要实现单选得让他们的name相同（单选和复选框的name都得相同）

submit可以进行数据提交通过value可以修改”提交“两字进行自定义

button点击后让js做相对的事情

file可以让别人上传文件

value有默认值的意思

value=" 内容 " 这里的内容会出现在输入框里面如果是选项则看不到（可以用来传数据给后台人员）

name和value主要是给后台人员使用

checked可以设置让单选和复选拥有默认选项（如果单选的都给checked，那么就会默认最后那个被选）

maxlength可以规定最大字符长度

相关代码

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

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <form align="center">
        <!-- 这里maxlength=6代表最多只能输入六个字符 -->
        用户名：<input type="text" name="user" value="请输入用户名" maxlength="6"><br>
        密码：<input type="password" name="pwd"> <br>
        性别：男 <input type="radio" name="sex" value="男"> 女 <input type="radio" name="sex" value="女"> 未知 <input
            type="radio" name="sex" value="未知" checked><br>
        <!-- 这里checked了未知所以默认选项会选向未知   下面checked了rap-->
        爱好：唱<input type="checkbox" name="hobby" value="唱"> 跳<input type="checkbox" name="hobby" value="跳"> rap <input
            type="checkbox" name="hobby" value="rap" checked>篮球 <input type="checkbox" name="hobby" value="篮球"><br>
        <br>
        <!-- 这里的submit可以提交数据 通过value可以修改”提交“两字进行自定义-->
        <input type="submit" value="注册">
        <input type="reset" value="重新填写"><br>
        <input type="button" value="获取短信验证码"><br>
        上传头像:<input type="file">
    </form>
</body>

</html>