HTML中button的formaction属性覆盖表单默认提交地址的用法-html教程-PHP中文网

formaction仅对type="submit"的button有效，必须显式声明type="submit"；若按钮在form外需用form="id"关联；它接管而非覆盖form的action，且不改变请求方法，须配合formmethod使用。

html中button的formaction属性覆盖表单默认提交地址的用法

formaction 只对 `type="submit"` 的 button 有效

写成 <button></button> 但没声明 type，或者写了 type="button"，formaction 就完全不触发——浏览器压根不会把它当提交按钮处理。必须显式写 type="submit"，哪怕表单里只有一个按钮也得写。

常见错误包括：

<button formaction="/api/save">保存</button> → 缺少 type="submit"，多数现代浏览器会按 type="submit" 回退，但不可靠；IE 和部分移动端行为不一致
<button type="button" formaction="/api/publish">发布</button> → type="button" 明确禁用提交行为，formaction 被忽略
按钮在 <form></form> 外部，又没用 form="form-id" 关联 → formaction 不生效，因为没有所属表单上下文

formaction 会彻底跳过 `form` 的 `action` 属性

不是“覆盖”，是“接管”：只要点击带 formaction 的 submit 按钮，浏览器连 <form action="..."></form> 的值都不会读。哪怕表单写了 action="/default"，按钮的 formaction="/api/preview" 也会直接生效。

注意几个关键点：

formaction 值支持绝对 URL（如 https://api.example.com/submit）、根路径（如 /api/draft）、相对路径（如 ../save），解析规则和 <a href></a> 一致
相对路径容易出错：如果当前页面是 /admin/product/edit/123，formaction="save" 实际请求的是 /admin/product/edit/save，不是你想要的 /save
建议统一用根路径写法，比如 formaction="/api/cart/add"，避免路径歧义

formaction 不改请求方法，`method` 还得靠 `formmethod` 或 `<form></form>`

formaction 只动地址，不动 GET/POST。它默认继承 <form method="post"></form> 的设置；如果你需要某个按钮走 GET、另一个走 POST，就必须配合 formmethod 使用。

例如：

html-deploy

使用 htmlcode.fun 将 HTML 内容或文件部署到网页，适用于用户要求“部署到网页”“托管此 HTML”“生成此前端...的实时链接”等场景。

下载

没加 formmethod 时，两个按钮都走 POST；加了之后，预览按钮发 GET 请求，发布按钮仍为 POST。

其他类似逻辑也适用：formenctype 控制编码类型（比如上传文件需 multipart/form-data），不显式写就沿用 <form enctype></form>。

IE9 及更早版本不支持 `input` 的 `formaction`，`button` 更稳妥

<input type="submit" formaction="/api/save"> 在 IE9 及以下会被完全忽略，回退到 <form></form> 的 action；而 <button type="submit" formaction="/api/save"></button> 在 IE10+、Chrome 9+、Firefox 4+、Safari 5.1+ 都能正常工作。

如果你的项目还要兼容老 IE（比如某些政企内网环境）：