17

在我现有的网页布局中，涉及多个文件，一个指定高级布局，有两个元素，一个用于左列，一个用于右列。

我想要一个单一的逻辑<form>（带有一个动作），其中<input>元素分布在左列和右列。做到这一点的唯一方法是让元素成为两个<div>s 的父级（并重构我的布局代码），还是可以<form [something]>在两个 div 中执行类似的操作，以便在一个表单中单击提交提交来自两个表单的所有输入？

4

4 回答 4

10

我认为人们错过了这个问题。A<form>可以包含它需要的任何元素。如果您的页面布局类似于：

<body>
    <div id="leftColumn"><input name="foo" type="text"></div>
    <div id="rightColumn"><input name="bar" type="text"></div>
<body>

您不需要单独foo的和bar表格。您可以愉快地将这两个<div>s 包含在一个<form>元素中：

<body>
    <form name="onlyOneForm">
        <div id="leftColumn"><input name="foo" type="text"></div>
        <div id="rightColumn"><input name="bar" type="text"></div>
    </form>
<body>
于 2012-12-14T19:15:22.697 回答
8

提交这两个表单的唯一方法是将两个<div>s 包装在一个<form>标记中。或者，您可以使用 jQuery/JavaScript 聚合数据并将它们作为一个提交一起提交。

于 2012-12-14T18:21:04.537 回答
8

（很抱歉不接受答案并发布我自己的答案，但我发现我得到的答案显然不是 HTML5 最新的！）

HTML5为元素 [1]引入了一个form=属性。<input>这样你就可以做<input form="form1" name="input1" /> and have it in a nested inner form, or even outside of the`元素。

[1] http://www.w3.org/TR/html5/association-of-controls-and-forms.html#attr-fae-form

于 2012-12-15T00:39:08.277 回答
1

简短的回答是不，你不能有两个单独form的标签作为 1 形式，而是将整个东西包装在一个包装 div 标签内

<form>
  <!-- some content with input elements has no relation with other form tag on this page, it just ends where you specify the end tag -->
</form>

<form>
  <!-- Has  no relation with the first form -->
</form>
于 2012-12-14T18:21:42.327 回答