在另一个html表单中有html表单是否有效?

是否有效的HTML有以下几点:

<form action="a"> <input.../> <form action="b"> <input.../> <input.../> <input.../> </form> <input.../> </form> 

所以当你提交“b”时,你只能得到内部表单中的字段。 当您提交“a”时,您将得到所有字段减去“b”中的字段。

如果这是不可能的,这种情况的解决方法是什么?

答: 这不是有效的HTML或XHTML

在官方的W3C XHTML规范中,B节“元素禁止”指出:

 "form must not contain other form elements." 

http://www.w3.org/TR/xhtml1/#prohibitions

至于旧的HTML 3.2规范 ,FORMS元素的部分规定:

“每个表单都必须包含在一个FORM元素中,在单个文档中可以有多个表单,但是FORM元素不能嵌套。

B. 解决方法

不过,有人已经尝试过:

“如何创build嵌套表单”

http://blog.avirtualhome.com/how-to-create-nested-forms/

注意: 虽然可以诱使W3Cvalidation程序通过脚本来操纵DOM来传递页面,但它仍然不是合法的HTML。 使用这种方法的问题是,您的代码的行为现在不能跨浏览器保证。 (因为它不是标准的)

如果有人发现这篇文章是一个很好的解决scheme,而不需要JS。 使用具有不同名称属性的两个提交button检查您的服务器语言中按下了哪个提交button,导致只有其中一个将被发送到服务器。

 <form method="post" action="ServerFileToExecute.php"> <input type="submit" name="save" value="Click here to save" /> <input type="submit" name="delete" value="Click here to delete" /> </form> 

如果你使用php,服务器端可能看起来像这样:

 <?php if(isset($_POST['save'])) echo "Stored!"; else if(isset($_POST['delete'])) echo "Deleted!"; else echo "Action is missing!"; ?> 

HTML 4.x和HTML5不允许嵌套表单,但HTML5将允许使用“表单”属性(“表单所有者”)的解决方法。

至于HTML 4.x,您可以:

  1. 使用只有隐藏字段和JavaScript的额外表单来设置其input并提交表单。
  2. 使用CSS排列几个HTML表单看起来像一个单一的实体 – 但我认为这太难了。

正如其他人所说,这不是有效的HTML。

这听起来像是你这样做的目的是在相互的视觉forms。 如果是这样,只要做两个单独的表格,并使用CSS来定位它们。

不,HTML规范指出没有FORM元素应该包含另一个FORM元素。

而是在表单的action属性中使用自定义的javascript方法!

例如

 <html> <head> <script language="javascript" type="text/javascript"> var input1 = null; var input2 = null; function InitInputs() { if (input1 == null) { input1 = document.getElementById("input1"); } if (input2 == null) { input2 = document.getElementById("input2"); } if (input1 == null) { alert("input1 missing"); } if (input2 == null) { alert("input2 missing"); } } function myMethod1() { InitInputs(); alert(input1.value + " " + input2.value); } function myMethod2() { InitInputs(); alert(input1.value); } </script> </head> <body> <form action="javascript:myMethod1();"> <input id="input1" type="text" /> <input id="input2" type="text" /> <input type="button" onclick="myMethod2()" value="myMethod2"/> <input type="submit" value="myMethod1" /> </form> </body> </html> 

一个可能性是在外部表单里面有一个iframe。 iframe包含内部表单。 确保在iframe的head标签内使用<base target="_parent" />标签,使表单作为主页的一部分。

不,见w3c

您可以通过将W3代码inputW3 Validator来轻松回答自己的问题。 (它具有文本input字段,你甚至不必把你的代码放在服务器上…)

(不,它不会validation。)

如果您需要您的表单向1:M关系数据库提交/提交数据,我build议在表A上创build一个“插入后”数据库触发器,它将为表B插入必要的数据。

不,这是无效的。 但是一个“解决scheme”可以在包含“b”forms的表单“a”之外创build一个模态窗口。

 <div id="myModalFormB" class="modal"> <form action="b"> <input.../> <input.../> <input.../> <button type="submit">Save</button> </form> </div> <form action="a"> <input.../> <a href="#myModalFormB">Open modal b </a> <input.../> </form> 

如果你正在使用bootstrap或者实现css,那么可以轻松完成。 我这样做是为了避免使用iframe。

    Interesting Posts