可以实现与嵌套表单相同的结果，但不需要嵌套它们。

HTML5引入了表单属性。可以将form属性添加到窗体外部的窗体控件，以便将它们链接到特定的窗体元素(通过id)。

https://www.impressivewebs.com/html5-form-attribute/

这样你可以像这样构造你的html:

<form id="main-form" action="/main-action" method="post"></form>
<form id="sub-form"  action="/sub-action"  method="post"></form>

<div class="main-component">
    <input type="text" name="main-property1" form="main-form" />
    <input type="text" name="main-property2" form="main-form" />

    <div class="sub-component">
        <input type="text" name="sub-property1" form="sub-form" />
        <input type="text" name="sub-property2" form="sub-form" />
        <input type="submit" name="sub-save" value="Save" form="sub-form" />
    </div>

    <input type="submit" name="main-save" value="Save" form="main-form" />
</div>

所有现代浏览器都支持form属性。虽然IE不支持这个功能，但IE不再是浏览器，而是一个兼容工具，微软自己也证实了这一点:https://www.zdnet.com/article/microsoft-security-chief-ie-is-not-a-browser-so-stop-using-it-as-your-default/。是时候停止关心如何在IE中工作了。

https://caniuse.com/#feat=form-attribute https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#attr-fae-form

来自html规范:

该特性允许作者解决缺乏支持的问题 嵌套表单元素。

即使您可以让它在一个浏览器中工作，也不能保证它在所有浏览器中都能正常工作。所以虽然你可能能让它在某些时候工作，但你肯定不能让它在所有时候都工作。

虽然这个问题已经很老了，而且我同意@everyone的观点，HTML中不允许嵌套表单

但这个东西大家可能都想看看

在那里你可以hack(我称之为黑客，因为我确定这不是合法的)html允许浏览器有嵌套的形式

<form id="form_one" action="http://apple.com">
  <div>
    <div>
        <form id="form_two" action="/">
            <!-- DUMMY FORM TO ALLOW BROWSER TO ACCEPT NESTED FORM -->
      </form>
    </div>
      <br/>
    <div>
      <form id="form_three" action="http://www.linuxtopia.org/">
          <input type='submit' value='LINUX TOPIA'/>
      </form>
    </div>
      <br/>

    <div>
      <form id="form_four" action="http://bing.com">
          <input type='submit' value='BING'/>
      </form>
    </div>
      <br/>  
    <input type='submit' value='Apple'/>
  </div>  
</form>

Js小提琴link

http://jsfiddle.net/nzkEw/10/

(参见thecode . .代码格式如下]2 .简单的技巧 简单地不要在另一个表单标签里面使用其他的元素，请使用相同的元素而不使用表单标签。

参见下面的例子 ""不使用另一种形式//只是召回输入图像描述元素在这里""

虽然我没有给出嵌套表单的解决方案(它不可靠地工作)，但我确实提出了一个适合我的解决方案:

使用场景:允许一次更改N个项的超表单。它底部有一个“提交全部”按钮。每个项目都有自己的嵌套表单，带有“提交项目# N”按钮。但是不能…

在这种情况下，实际上可以使用单个表单，然后将按钮的名称设为submit_1..submit_N和submitAll并在服务器端处理它，如果按钮的名称是submit_1，则只查看以_1结尾的参数。

<form>
    <div id="item1">
        <input type="text" name="foo_1" value="23">
        <input type="submit" name="submit_1" value="Submit Item #1">
    </div>
    <div id="item2">
        <input type="text" name="foo_2" value="33">
        <input type="submit" name="submit_2" value="Submit Item #2">
    </div>
    <input type="submit" name="submitAll" value="Submit All Items">
</form>

好吧，这算不上什么发明，但确实管用。

一个简单的解决方法是使用iframe来保存“嵌套”表单。 从视觉上看，表单是嵌套的，但在代码方面，它在一个单独的html文件中。