HTML 表单属性说明

本章描述了 HTML <form> 元素的不同属性以及具体的用法。

action 属性

通常，当用户单击提交按钮时，表单数据会发送到服务器上的表单处理程序。 action 属性则定义了提交表单时服务器的表单处理程序。

在下面的示例中，表单数据被发送到名为 action_page.php 的文件，此文件位于服务器段啊，包含处理表单数据脚本和逻辑。

<form action="/action_page.php">
  <label for="name">姓名：</label><br />
  <input type="text" id="name" name="name" value="张三" /><br />
  <label for="age">年龄：</label><br />
  <input type="text" id="age" name="age" value="20" /><br /><br />
  <input type="submit" value="Submit" />
</form>

! **提示：**如果省略 action 属性，那么处理程序的 URL 和当前页面的 URL 一样。

target 属性

target 属性指定在表单提交的目的地是在当前页面，或新页面，亦或是一个框架页面中。和 <a> 元素的 target 属性的作用相同。

target 属性可以具有以下值之一：

默认值是 _self 为当前窗口。

在这里，提交的结果将在新的浏览器选项卡中打开：

<form action="/action_page.php" target="_blank"></form>

method 属性

method 属性指定提交表单数据时要使用的 HTTP 方法。

常用的 method 有：

• method="get" 表单数据作为 URL 参数发送到服务器
• method="post" 表单数据作为请求正文消息体发送到服务器

提交表单数据时的默认 HTTP 方法是 GET。

本示例在提交表单数据时使用 GET 方法：

<form action="/action_page.php" method="get"></form>

本示例在提交表单数据时使用 POST 方法：

<form action="/action_page.php" method="post"></form>

GET 方法注意事项：

• 将表单数据以 名称/值 对的形式附加到 URL
• 切勿使用 GET 发送敏感数据，因为提交的表单数据在 URL 中可见
• URL 的长度有限制（2048 个字符）
• GET 对于用户想要为结果添加书签的表单提交很有用
• GET 适用于非安全数据，例如 Google 中的查询字符串

POST 方法注意事项：

• 在 HTTP 请求的正文中附加表单数据（提交的表单数据未显示在 URL 中）
• POST 没有大小限制，可用于发送大量数据。
• 使用 POST 提交的表单无法添加书签

! **提示：**如果表单数据包含敏感或个人信息，请始终使用 POST！

autocomplete 属性

autocomplete 属性指定表单是否应打开或关闭自动完成功能。

启用自动完成后，浏览器会根据用户之前输入的值自动输入对应的值。

具有自动完成功能的表单：

<form action="/action_page.php" autocomplete="on"></form>

novalidate 属性

novalidate 属性是一个布尔属性。当存在时，提示提交时不应验证表单数据（输入）。

具有 novalidate 属性的表单：

<form action="/action_page.php" novalidate></form>

所有 <form> 属性的列表