formaction 是 或 的 html5 原生属性,用于覆盖 的 action,实现同一表单多地址提交;必须配合 type="submit" 使用,支持相对/绝对 url,并可与 formmethod、formtarget 等协同控制提交行为。

HTML5 的 formaction 属性允许你在同一个表单中,为不同的提交按钮指定各自独立的提交地址,从而实现“一个表单、多个后端接口”的灵活提交,无需 JavaScript 也能完成。
formaction 是什么?
它是 <button></button> 或 <input type="submit"> 元素的原生属性,优先级高于表单自身的 action 属性。只要按钮带有 formaction,点击它时就会忽略 <form></form> 标签里的 action,直接提交到该按钮指定的 URL。
基本用法示例
下面是一个含两个提交按钮的表单,分别提交到 /save 和 /publish:
关键注意事项
-
必须配合
type="submit":只有 submit 类型的按钮(<button></button>或<input type="submit">)才能触发表单提交并生效formaction -
method 可单独控制:可同时使用
formmethod(如formmethod="POST"或formmethod="GET"),覆盖表单默认的method -
支持相对和绝对 URL:例如
formaction="api/submit"、formaction="https://api.example.com/v1/save" -
不改变表单其他行为:所有输入字段(
name值)仍按标准方式序列化提交,与普通表单一致
进阶技巧:结合 formtarget 和 formenctype
你还可以进一步定制提交行为:
-
formtarget="_blank":在新标签页打开响应结果(适合导出类操作) -
formenctype="multipart/form-data":仅对该按钮启用文件上传编码(其他按钮保持默认application/x-www-form-urlencoded) -
formnovalidate:跳过该按钮的 HTML5 表单验证(例如“暂存”按钮不校验必填项)
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!











