前端入坑第八天

最新推荐文章于 2024-07-28 21:35:25 发布

Brittany____

最新推荐文章于 2024-07-28 21:35:25 发布

阅读量74

点赞数

分类专栏：前端文章标签：前端

本文链接：https://blog.csdn.net/Brittany____/article/details/127604904

版权

前端专栏收录该内容

19 篇文章 1 订阅

订阅专栏

input

input标签（行内元素）

type 元素的类型
-text 文本框
-password 密码框
-radio 单选框
-checkbox 复选框
-file 文件域
-hidden 隐藏域
-button 普通按钮
-submit 提交按钮
-reset 重置按钮
-date 日期框
value 元素的值
readonly 只读状态
maxlength 最多输入的长度
disabled 禁用标签

注意：
1.单选框需要通过name属性设置为一组，复选框也需要通过name属性设置为一组。
2.如果是上传文件的表单，则表单需要设置一个属性 enctype="multipart/form-date"，提交方式为post请求。
3.没有name属性是无法提交数据的！！！

在这里插入图片描述

代码块

<!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>input</title>
</head>
<body>
    <form action="http://www.baidu.com" method="get">
        文本框：<input type="text" value="fengbaobao" maxlength="12"><br>
        文本框：<input type="text" value="fengbaobao" readonly="readonly"><br>
        密码框：<input type="password"><br>
        单选框：<input type="radio" value="male" name="gender"> 男
                <input type="radio" value="female" name="gender"> 女<br>
        复选框：<input type="checkbox" value="1" name="test"> 1
                <input type="checkbox" value="2" name="test"> 2
                <input type="checkbox" value="3" naem="test"> 3 <br>
        文件域：<input type="file"><br>
        隐藏域：<input type="hidden" value="admin"><br>
        普通按钮：<input type="button" value="普通按钮"><br>
        普通按钮：<input type="button" value="普通按钮" disabled="disabled"><br>
        提交按钮：<input type="submit" value="提交按钮"><br>
        重置按钮：<input type="reset" value="重置按钮"><br>
        日期框：<input type="date"><br>
    </form>
</body>
</html>