HTML | <form> novalidate 属性

在 HTML 中的 <form> 元素可以用于创建用户交互的表单，让用户提交数据。<form> 元素有一个 novalidate 属性，它用于指定表单在提交时不进行验证。

使用示例

以下是一个简单的表单示例，展示了如何使用 novalidate 属性：

<form action="/submit" method="post" novalidate>
  <label for="name">Name:</label>
  <input type="text" id="name" name="name" required>
  <br>
  <label for="email">Email:</label>
  <input type="email" id="email" name="email" required>
  <br>
  <input type="submit" value="Submit">
</form>

在上面的示例中，novalidate 属性被添加到 <form> 元素上。这意味着当用户点击 "Submit" 按钮时，浏览器不会执行默认的表单验证操作。

作用

novalidate 属性的作用是禁用浏览器的默认表单验证行为。当表单提交时，浏览器会检查每个必填字段是否有有效值，以及是否满足其他验证规则（如 email 类型的字段必须包含有效的电子邮件地址）。添加了 novalidate 属性后，浏览器将不再进行这些验证，而提交数据如实地发送到服务器上。

使用 novalidate 属性可能有时候是有意义的，例如：

• 当你想要在 JavaScript 中自定义表单验证逻辑时，可以禁用浏览器默认的验证行为。
• 当你需要让用户自由地输入任何文本（例如备注或评论）而不限制其内容时，可以禁用验证。
• 当你想要在服务器端进行完全自定义的验证逻辑时，可以禁用浏览器验证。

注意事项

尽管 novalidate 属性可以禁用浏览器的默认表单验证行为，但仍然需要进行服务器端验证，以确保提交的数据的完整性和安全性。因此，即使使用了 novalidate 属性，也要谨慎对待来自用户的输入，并在服务器端进行适当的验证和过滤。

附加资源

• HTML <form> 元素参考