formaction是button或input[type="submit"]的属性，用于覆盖form的action实现多提交地址，如保存草稿、发布、预览；需配合formmethod、formenctype等使用，现代浏览器均支持。
HTML5 的 formaction 属性让同一个表单能根据不同的按钮触发不同地址的提交，无需 JavaScript 就可实现多场景操作，比如“保存草稿”、“发布文章”、“预览内容”共用一个表单结构。
理解 formaction 的作用位置
formaction 是 <button> 或 <input type="submit"> 的专属属性，**不能写在 <form> 标签上**。它会临时覆盖 <form> 的 action 属性，仅对该按钮点击时生效。
- 表单本身可以保留通用 action（如默认提交到 /api/save），作为兜底行为
- 每个提交按钮各自声明
formaction，指向对应后端接口，例如：formaction="/api/draft"、formaction="/api/publish" - 浏览器会忽略 <form> 的 method 和 enctype，改用按钮上指定的
formmethod（可选）和formenctype（可选）
基础用法示例
以下是一个博客编辑表单，支持三种提交方式：
<form id="postForm" action="/api/save" method="POST"> <input name="title" placeholder="标题"> <textarea name="content"></textarea> <p><!-- 保存为草稿 --> <button type="submit" formaction="/api/draft" formmethod="POST">保存草稿</button></p><p><!-- 预览内容（GET 请求，不修改数据）--> <button type="submit" formaction="/preview" formmethod="GET">预览</button></p><p><!-- 正式发布 --> <button type="submit" formaction="/api/publish" formmethod="POST">发布</button> </form>
点击不同按钮，浏览器将向不同 URL 发起对应 method 的请求，且携带全部表单项数据（除非用 formnovalidate 或 formtarget 控制校验与打开方式）。
立即学习“前端免费学习笔记（深入）”；
配合其他表单控制属性提升体验
单靠 formaction 已足够区分目标地址，但搭配以下属性可更精准适配业务逻辑：
-
formnovalidate：跳过 HTML5 内置校验，适合“保存草稿”类非完整提交场景 -
formtarget：指定提交后响应展示位置，如formtarget="_blank"用于预览页新开窗口 -
name和value：后端可通过按钮的 name/value 区分操作意图（例如<button name="action" value="publish">），即使多个按钮指向同一formaction - 配合
disabled或 CSS 状态，避免重复点击（需 JS 辅助，因formaction本身无防重机制）
注意事项与兼容性
formaction 是 HTML5 标准属性，现代浏览器（Chrome、Firefox、Edge、Safari 6+）均支持，IE10+ 也支持。但要注意：
- 服务器必须能正确接收并解析相同字段名在不同 endpoint 下的语义（如 /api/draft 可接受部分字段，/api/publish 要求字段完整）
- 如果某按钮需要上传文件，记得设置对应按钮的
formenctype="multipart/form-data"，否则默认使用application/x-www-form-urlencoded - 不建议在单个表单中混用大量异构操作；若逻辑复杂（如条件校验、字段动态增删），仍应引入 JavaScript 做统一控制
