HTML Dog
跳至导航

HTML 标签：input

一个表单控件，允许用户输入。它可以是多种类型之一，包括文本字段、复选框或提交按钮。

input 没有内容，因此不需要闭合标签。

可选属性

属性 描述 可能的值
name 表单控件的名称，与其值配对。 文本（无空格）。
type 表单控件的类型。
  • text：文本字段 — 不带换行的文本。(默认)
  • password：带隐藏输入的文本字段。
  • checkbox：复选框 / 勾选框。
  • radio：单选按钮 — 允许在一组具有相同name属性值的控件中选择一个。
  • submit：提交按钮 — 提交表单。
  • reset：重置按钮 — 将表单中的控件重置为其初始默认值。
  • hidden：一个用户无法直接访问但其值会随表单数据一起提交的隐藏控件。
  • image：一个图片，点击或以其他方式选中后会提交表单。点击图片时的像素坐标将成为控件的值。
  • file：文件上传 — 允许选择本地文件进行提交。
  • button：没有默认行为的按钮。
  • search：用于搜索字符串的文本字段。
  • tel：用于电话号码的文本字段。
  • url：用于绝对 URL 的文本字段。
  • email：用于电子邮件地址的文本字段。
  • date：日期选择控件。
  • time：时间选择控件。
  • number：用于数字值的文本字段或微调器。
  • range：滑块或类似控件，用于从可能不精确的范围中选择一个数值。
  • color：颜色选择器，带有 8 位 sRGB 值。
value 初始值。 取决于类型。
checked 将 checkbox 或 radio 类型设置为默认勾选。 无。
maxlength 值中允许的最大字符数。 数字。
minlength 值中允许的最小字符数。 数字。
src 当 type 为 image 时使用且必需。要使用的图像文件的位置。 URL。
alt 当 type 为 image 时使用且必需。如果 src 指定的图像不可用，将用于替换图像的替代文本。 文本。
width 当 type 为 image 时使用。图像的像素宽度。 数字。
height 当 type 为 image 时使用。图像的像素高度。 数字。
accept 当 type 为 file 时使用。指示接受的文件类型。 单个实例或逗号分隔的列表
  • audio/*：音频文件。
  • video/*：视频文件。
  • image/*：图像文件。
  • MIME 类型，例如 application/pdf。
  • 特定文件扩展名，例如 .pdf。
disabled 禁用表单控件。 无。
readonly 使表单控件无法由用户更改。 无。
autocomplete 浏览器是否应实现控件的自动完成功能。
  • on (默认)
  • off
autofocus 指示表单控件在页面加载时应获得焦点。页面上应仅使用一个表单控件。 无。
dirname 添加一个附加字段，用于发送表单控件值的方向性。 文本（无空格）。例如，dirname="this.dir" 将在提交的数据中附加 this.dir=ltr（从左到右）或 this.dir=rtl（从右到左）。
form 明确将控件与一个 form 元素关联起来，该元素可能包含或不包含该控件。如果省略，控件将与其 form 父元素相关联。 与 form 元素的 id 属性值匹配的文本。
formaction 当 type 为 submit 或 image 时使用。提交表单数据应发送到的地址。将覆盖 form 元素的 action 属性。 URL。
formmethod 当 type 为 submit 或 image 时使用。应使用哪种 HTTP 方法发送提交的表单数据。将覆盖 form 元素的 method 属性。
  • get：将表单值附加到提交表单的 URL。例如，用于简单数据发送，如搜索查询。
  • post：将表单数据不可见地发送到提交的 HTTP 请求的正文中。例如，用于更详细或安全的数据发送，如联系表单。
formenctype 当 type 为 submit 或 image 时使用。用于编码表单数据的 MIME 类型。将覆盖 form 元素的 enctype 属性。
  • application/x-www-form-urlencoded：默认。
  • multipart/form-data：用于表单中使用文件 input 元素时。
  • text/plain：纯文本。
formnovalidate 当 type 为 submit 或 image 时使用。指示在提交表单之前不应对其进行验证。将覆盖 form 元素的 novalidate 属性。 无。
formtarget 当 type 为 submit 或 image 时使用。提交表单的目标 URL 应打开的浏览上下文。将覆盖 form 元素的 target 属性。
  • _self：在当前窗口/标签页中打开。
  • _blank：在新窗口/标签页中打开。
list 将表单控件与一组要建议给用户的选项关联起来。 匹配 datalist 元素 id 属性值的文本。
max 当 type 为 date、time、number 或 range 时使用。最大值。 数字。
min 当 type 为 date、time、number 或 range 时使用。最小值。 数字。
step 当 type 为 date、time、number 或 range 时使用。可以增加或减少值的增量。 数字或 any。
multiple 当 type 为 email 或 file 时使用。表示用户可以输入多个值。 无。
pattern 可以用来检查值的正则表达式。 正则表达式。
placeholder 用户应输入何种数据的可见提示。 文本。
required 指示表单字段必须填写。 无。
size 用户在编辑时应预期的文本类型控件的字符数。 数字。
全局属性

示例


<form action="someKindOfProcessingScript.php" method="post">
    <label for="username">Name</label>
    <input name="username" id="username">

    <label for="housenumber">House number</label>
    <input type="number" name="housenumber" id="housenumber">

    <label for="street">Street</label>
    <input name="street" id="street">

    <label for="emailaddress">Email address</label>
    <input type="email" placeholder="you@somewhere.com" name="emailaddress" id="emailaddress">

    <input type="submit" value="Sign up!">
</form>