表单内部的表单，好吗？

Question

我们是否可以在另一个表单中有一个表单？这有什么问题吗？

Answer 1

虽然在一个HTML页面中可以有多个<form>元素，但不能将它们嵌套。

Answer 2

是的。这是错误的。它不会工作，因为它是错误的。大多数浏览器只会看到一种形式。

http://www.w3.org/MarkUp/html3/forms.html

Answer 3

号HTML明确禁止嵌套形式。

从HTML 5 draft：

内容模型： 流量的内容，但没有表单元素后裔。

从HTML 4.01 Recommendation：

<!ELEMENT FORM - - (%block;|SCRIPT)+ -(FORM) -- interactive form -->

（注意 - （FORM）一节）。

Answer 4

这不是有效的XHTML必须有嵌套窗体。但是，您可以使用多个提交按钮并使用服务器端脚本根据用户点击哪个按钮来运行不同的代码。

Answer 5

不，我们不能另一种形式中嵌套形式这样

<form name='form1'> 
     <form name='form2'> 
      //some code here 
     </form> 
</form> 

它会在某些情况下工作，但不推荐用于通用平台。您可以在单个窗体中使用大量的SUBMIT按钮，但不能适当地管理嵌套窗体。

Answer 6

如果你有一个主表单，并且被迫有一个“带有表单的表单”这里是你可以做的......在我的情况下，我有一个在globalHeader中的链接，我想在它执行一个帖子时被点击：

实例形式后与链接按钮提交：

取而代之的是形式...换你输入一个div：

<div id="gap_form"><input type="hidden" name="PostVar"/><a id="myLink" href="javascript:Form2.submit()">A Link</a></div> 

js文件：

$(document).ready(function() { 
(function() { 
    $('#gap_form').wrap('<form id="Form2" action="http://sitetopostto.com/postpage" method="post" target="_blank"></form>'); 
})();}); 

这将包裹一切表格内的div“gap_form”内的所有内容，链接将提交该表单。我现在有一个确切的例子在一个页面上工作...（在我的例子中...你可以通过重定向到一个新页面并在该页面上提交表单来完成同样的事情......但我更喜欢这样）

Answer 7

嵌套表单不受支持，不属于w3c标准（正如你们许多人所说的）。

但是HTML5增加了对输入的支持，这些输入不必是任何形式的后代，但可以通过使用“form”属性以多种形式提交。这并不完全允许嵌套窗体，但通过使用此方法，可以模拟嵌套窗体。

“form”属性的值必须是表单的id，或者在多个表单的情况下，将表单id与空格分开。

你可以阅读更多here

Answer 8

另一种解决办法是启动包含其自身形式

Answer 9

表格嵌套可以用新的HTML5输入元素的形式属性来实现一个模态窗口。尽管我们没有在结构上嵌套表格，但是投入的评估方式是以自己的形式进行的。在我的测试中，除IE（IE11）外，3种主流浏览器都支持这一功能。表单嵌套限制是HTML UI设计的一大障碍。

这里是一个示例代码，当您单击保存按钮，你应该看到 “2次3成功”（原件http://www.impressivewebs.com/html5-form-attribute/）：

<form id="saveForm" action="/post/dispatch/save" method="post"></form> 
<form id="deleteForm" action="/post/dispatch/delete" method="post"></form> 

<div id="toolbar"> 
    <input type="text" name="foo" form="saveForm" /> 
    <input type="hidden" value="some_id" form="deleteForm" /> 
    <input type="text" name="foo2" id="foo2" form="saveForm" value="success" /> 

    <input type="submit" name="save" value="Save" form="saveForm" onclick="alert(document.getElementById('deleteForm').elements.length + ' ' + document.getElementById('saveForm').elements.length + ' ' + document.getElementById('saveForm').elements['foo2'].value);return false;" /> 
    <input type="submit" name="delete" value="Delete" form="deleteForm" /> 
    <a href="/home/index">Cancel</a> 
</div>