前端 html5 新增属性

关于取消表单校验的常用方法中 formnovalidste 属性的用法，取消表单校验啥意思

• 以下回答由chatgpt基于相关博客总结生成:

  formnovalidate属性可以用于取消表单校验，常用的方法有两种：

  方法一：在表单中使用formnovalidate属性

  在表单中使用formnovalidate属性可以使某个按钮在触发表单提交时，不进行表单校验。例如：

  <form action="#" method="post">
    <input type="text" name="username" required>
    <input type="submit" value="提交">
    <input type="submit" value="直接提交，不进行表单校验" formnovalidate>
  </form>
  

  在这个例子中，如果用户直接点击“提交”按钮，则会进行表单校验，如果用户点击“直接提交，不进行表单校验”按钮，则不会进行表单校验。

  方法二：在提交按钮中使用formnovalidate属性

  在提交按钮中使用formnovalidate属性同样可以实现取消表单校验的效果。例如：

  <form action="#" method="post">
    <input type="text" name="username" required>
    <input type="submit" value="提交">
    <input type="submit" value="直接提交，不进行表单校验" formnovalidate>
  </form>
  

  在这个例子中，如果用户直接点击“提交”按钮，则会进行表单校验，如果用户点击“直接提交，不进行表单校验”按钮，则不会进行表单校验。

  “取消表单校验”的含义是指在表单提交时，如果某个按钮使用了formnovalidate属性，则不会进行表单校验。例如，如果表单中有required属性（即必填项），用户点击了“直接提交，不进行表单校验”的按钮，则即使有必填项没有填写，也会提交表单。

该回答引用chatgpt:
当用户点击第一个提交按钮时，浏览器会进行表单校验，如果输入框为空，浏览器会显示错误提示。当用户点击第二个按钮时，由于设置了 formnovalidate 属性，浏览器会跳过表单校验，直接提交表单。

<form action="/submit" method="post">
  <input type="text" name="username" required>
  <input type="password" name="password" required>
  <button type="submit">提交</button>
  <button type="submit" formnovalidate>跳过校验并提交</button>
</form>