HTML form 属性

17 Mar 2025 | 5 分钟阅读

<form> 元素 HTML 属性

在 HTML 中,<form> 元素有多种可用属性,如下所示:

HTML action 属性

<form> 元素的 action 属性定义了当表单提交时要执行的处理,或者是一个处理表单信息的 URI。

action 属性的值定义了处理信息的网页。它可以是 .php、.jsp、.asp 等,或者您希望处理表单的任何 URL。

注意:如果 action 属性值为空,则表单将在同一页面进行处理。

示例

立即测试

输出

表单元素 action 属性演示







点击提交按钮后,它将重定向到新页面 "action.html"


HTML method 属性

method 属性定义了浏览器用于提交表单的 HTTP 方法。method 属性的可能值有:

  • post:当我们想处理敏感数据时,可以使用 method 属性的 post 值,因为它不会在 URL 中显示提交的数据。

示例

  • get:method 属性的 get 值是提交表单时的默认值。但它不太安全,因为它在提交表单后会在 URL 中显示数据。

示例

提交数据时,它会以以下形式显示输入的数据:


HTML target 属性

target 属性定义了提交表单后响应将在何处打开。以下是与 target 属性一起使用的关键字。

  • _self:如果我们使用 _self 作为属性值,则响应将仅显示在当前页面。

示例

  • _blank:如果我们使用 _blank 作为属性,它将在新页面中加载响应。

示例


HTML autocomplete 属性

HTML autocomplete 属性是 HTML5 新增的属性,它使输入字段能够自动完成。它可以有两个值 "on" 和 "off",分别启用或禁用自动完成。autocomplete 属性的默认值是 "on"。

示例

示例

注意:它可以同时用于 <form> 元素和 <input> 元素。


HTML enctype 属性

HTML enctype 属性定义了在将表单内容提交到服务器时表单内容的编码类型。enctype 的可能值有:

  • application/x-www-form-urlencoded:如果表单未包含 enctype 属性,这是默认的编码类型。所有字符在提交表单之前都会被编码。

示例

  • multipart/form-data:它不会对任何字符进行编码。当我们的表单包含文件上传控件时使用。

示例

  • text/plain (HTML5):在这种编码类型下,只有空格会被编码成 + 号,而没有其他特殊字符被编码。

示例


HTML novalidate 属性 HTML5

novalidate 属性是 HTML5 新增的布尔属性。如果我们将其应用于表单,则它不会执行任何类型的验证,而是直接提交表单。

示例

立即测试

输出

填写表单

输入姓名

输入年龄

输入邮箱

尝试使用 novalidate 属性和不使用 novalidate 属性更改表单详情,看看区别。


HTML <input> 元素属性

HTML name 属性

HTML name 属性定义了输入元素的名称。提交表单时,name 和 value 属性会包含在 HTTP 请求中。

注意:不应该省略 name 属性,因为在提交表单时,HTTP 请求会包含 name-value 对,如果 name 不可用,则不会处理该输入字段。

示例

立即测试

输出

填写表单

输入姓名

输入年龄

输入邮箱

注意:如果不在任何输入字段中使用 name 属性,则在提交表单时,该输入字段将不会被提交。

点击提交,查看 URL,由于我们在 email 输入字段中没有使用 name 属性,所以 email 未包含在 HTTP 请求中


HTML value 属性

HTML value 属性定义了输入字段的初始值或默认值。

示例

立即测试

输出

填写表单










注意:在密码输入字段中,value 属性始终是模糊的。


HTML required 属性 HTML5

HTML required 是一个布尔属性,它指定用户在提交表单之前必须填写该字段。

示例

立即测试

输出

填写表单







如果您尝试在未填写 email 字段的情况下提交表单,它将显示一个错误弹出窗口。


HTML autofocus 属性 HTML5

autofocus 是一个布尔属性,它允许在网页加载时自动聚焦一个字段。

示例


HTML placeholder 属性 HTML5

placeholder 属性指定输入字段内的文本,它会告知用户该字段预期的输入内容。

placeholder 属性可用于文本、密码、电子邮件和 URL 值。

当用户输入值时,placeholder 将自动移除。

示例

立即测试

输出

注册表单











HTML disabled 属性

当应用 HTML disabled 属性时,它会禁用该输入字段。被禁用的字段不允许用户与该字段进行交互。

禁用的输入字段不会接收点击事件,并且在提交表单时,这些输入值不会发送到服务器。

示例

立即测试

输出

注册表单











HTML size 属性

size 属性控制输入字段以字符数计的大小。

示例

立即测试

输出

带有 disabled 属性的注册表单











HTML form 属性

HTML form 属性允许用户指定一个在表单之外但仍属于父表单一部分的输入字段。

示例

立即测试

输出

用户名


用户密码


email 字段在表单之外,但仍然属于表单的一部分

用户邮箱

下一主题HTML 与 CSS