详解HTML input标签的formmethod属性如何覆盖原表单提交方式

数码系统

相机 win10

测评 win11

手机智车

华为 Tesla

小米理想

苹果蔚来

游戏软件

LOL 抖音

原神微信

当前位置：首页

前端开发

详解HTML input标签的formmethod属性如何覆盖原表单提交方式

热心网友时间：2026-06-28

转载

这个属性本质上是一个“替补选手”——它仅在特定场景下发挥作用，但很多开发者从一开始就未能准确掌握它的使用条件。下面我们将它的几个核心限制逐一拆解说明。

详解HTML中input标签的formmethod属性_覆盖原表单的提交方式

**formmethod 仅对 type="submit" 生效，其他 type 值均被忽略** 不少开发者为 —— 缺少type="submit"，因此无效 - —— type不匹配，浏览器直接跳过该属性 - —— GET使用了大写，部分旧版浏览器会自动降级为表单默认的method **formmethod 的值只能是 get 或 post，其他如 delete/put 会被静默降级** HTML原生表单并不支持DELETE、PUT等HTTP方法，formmethod同样不例外。如果你写了formmethod="delete"，Chrome和Firefox会直接无视该属性，转而使用

的method设置；Safari可能会降级为GET；IE 10及更高版本则会干脆忽略整条属性。因此不要指望通过formmethod来实现RESTful操作——后端若要接收DELETE请求，前端必须借助JavaScript拦截提交，比如使用event.preventDefault()配合fetch()手动发送请求。实际可用的值只有两个： - get（必须全小写） - post（必须全小写）大小写敏感并非建议，而是实际行为：某些Android WebView或旧版Safari会将POST识别为非法值进行处理。 **不搭配 formaction，formmethod 等于形同虚设** formmethod只改变请求方法，并不更改请求地址。即使你点击了「取消」按钮并添加了formmethod="get"，只要没有配置formaction，数据依然会发送到所指定的地址，只是请求方式变成了GET——参数全部拼接在URL上，后端若是只读取$_POST或req.body，将无法接收到任何数据。正确的写法必须成对出现： - - - —— 特别注意：formaction=""不会生效，会回退到的action设置另外，formaction的优先级高于的action，且每个按钮可以独立指定，相互之间不受影响。 **它只作用于原生提交，JavaScript 提交时完全失效** 一旦你在表单上绑定了submit事件并调用了event.preventDefault()，或者使用fetch()/axios手动发送请求，formmethod和formaction就仅仅是HTML字符串中的普通属性，浏览器不会读取、不会解析、更不会应用。这意味着： - 不能依赖formmethod来“切换”JS提交的method；需要在JavaScript中自行判断按钮类型，再决定使用POST还是GET - 后端接口必须显式支持对应的method：比如通过formmethod="get"提交时，后端需要从query string中获取参数，而非从body中读取 - IE9及更早版本完全不支持formmethod，需要提供降级方案，例如监听按钮点击事件后动态修改form.method和form.action 最容易忽略的一点是：formmethod仅在“用户点击submit按钮 → 浏览器发起原生HTTP请求”这条路径下生效。在现代项目中，这条路径越来越短，大多数情况下它只是一个优雅降级的备用方案，而非核心逻辑。

来源:https://www.php.cn/faq/2676119.html

上一篇： CSS writing-mode属性如何实现文字竖排显示的方法与示例

下一篇： HTML5拖拽API嵌套元素中子元素的拖拽行为处理方法