HTML表单中formtarget属性的作用及target属性覆盖方法
在HTML表单交互场景中，<form>标签的target属性用于指定表单提交后，服务器响应内容在哪个窗口或框架中展示。而formtarget属性作为对target属性的补充，主要应用于表单内的提交按钮元素，用于单独为当前提交操作指定展示窗口，覆盖表单本身的target设置。
一、formtarget属性的作用
formtarget属性是HTML5新增的表单相关属性，仅适用于<button>或<input type="submit">、<input type="image">这类提交类型的表单控件。它的核心作用是：当点击该提交按钮提交表单时，忽略<form>标签上设置的target属性，使用formtarget指定的值作为响应内容的展示目标。
该属性的可选值与target属性一致，常见取值如下：
_self：默认取值，响应内容在当前窗口/框架中展示
_blank：响应内容在新窗口或新标签页中展示
_parent：响应内容在父级框架中展示，若没有父框架则等同于_self
_top：响应内容在最顶层的窗口中展示，会跳出所有嵌套框架
框架名称：响应内容在指定名称的<iframe>或框架中展示
二、如何覆盖表单的target属性
覆盖表单的target属性不需要额外的JavaScript逻辑，仅需要通过提交按钮的formtarget属性即可实现，具体分为两种场景：
2.1 表单已设置target属性时的覆盖
当<form>标签已经设置了target属性，只需要在对应的提交按钮上添加formtarget属性，并设置为期望的目标值，提交时就会优先使用formtarget的值，忽略表单的target设置。
示例代码如下：
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>formtarget覆盖target示例</title> </head> <body> <!-- 表单设置target为_blank，默认提交会在新标签页打开响应 --> <form action="https://www.ipipp.com/submit" method="post" target="_blank"> <label for="username">用户名：</label> <input type="text" id="username" name="username"> <br><br> <!-- 第一个提交按钮未设置formtarget，使用表单的target=_blank --> <input type="submit" value="普通提交（新标签页打开）"> <br><br> <!-- 第二个提交按钮设置formtarget=_self，覆盖表单的target属性 --> <input type="submit" formtarget="_self" value="当前页提交（覆盖target）"> <br><br> <!-- 第三个提交按钮设置formtarget=myFrame，响应在指定iframe展示 --> <input type="submit" formtarget="myFrame" value="在iframe中提交"> </form> <br> <iframe name="myFrame" width="600" height="200"></iframe> </body> </html>
上述代码中，第一个提交按钮点击后会按照表单的target="_blank"在新标签页打开响应；第二个按钮因为设置了formtarget="_self"，点击后会在当前页面展示响应，覆盖了表单的原始设置；第三个按钮的响应会展示在名称为myFrame的iframe中。
2.2 多个提交按钮设置不同展示目标
如果一个表单有多个提交按钮，需要不同的提交操作对应不同的响应展示位置，只需要给每个提交按钮分别设置不同的formtarget值即可，不需要修改表单的target属性。
示例代码如下：
<form action="https://www.ipipp.com/handle" method="get"> <p>请选择提交后的响应展示方式：</p> <button type="submit" formtarget="_blank">在新标签页查看结果</button> <button type="submit" formtarget="_self">在当前页查看结果</button> <button type="submit" formtarget="resultFrame">在下方框架查看结果</button> </form> <iframe name="resultFrame" width="800" height="300"></iframe>
点击不同的按钮，表单会以相同的参数提交到同一个处理地址，但响应内容会根据对应按钮的formtarget值展示在不同的位置。
三、注意事项
1. formtarget属性仅对提交类型的按钮生效，对<input type="button">这类普通按钮无效，因为普通按钮不会触发表单提交。
2. 如果表单没有设置target属性，提交按钮的formtarget属性依然生效，此时相当于为本次提交单独指定了响应展示目标，默认未设置formtarget的提交按钮会使用_self作为目标。
3. 如果同时存在多个提交按钮都设置了formtarget，仅点击的按钮对应的formtarget值会生效，不会影响其他按钮的提交行为。