HTML：是否可以使用XHTML有效方式在每个TABLE ROW中都有一个FORM标记？

Question

我可以最好地描述如下：

我想要这个（整个表放入editmode并在每一行中保存按钮）。

<table>

    <tr>

        <td>Id</td>

        <td>Name</td>

        <td>Description</td>

        <td>&nbsp;</td>

    </tr>

    <tr>

        <td><input type="hidden" name="id" value="1" /></td>

        <td><input type="text" name="name" value="Name" /></td>

        <td><input type="text" name="description" value="Description" /></td>

        <td><input type="submit" value="Save" /></td>

    </tr>

    <tr>

        <td><input type="hidden" name="id" value="2" /></td>

        <td><input type="text" name="name" value="Name2" /></td>

        <td><input type="text" name="description" value="Description2" /></td>

        <td><input type="submit" value="Save" /></td>

    </tr>

    <!-- and more rows here ... -->

</table>

我应该在哪里放置<form>标签？

Answer 1

你不能 您唯一的选择是将其分为多个表，然后将form标记放在表之外。您可能最终嵌套了表格，但是不建议这样做：<table>&nbsp; <tr><td><form>&nbsp; &nbsp; <table><tr><td>id</td><td>name</td>...</tr></table>&nbsp; </form></td></tr></table>我将完全删除表格，并用div和span等样式化的html元素替换表格。

Answer 2

值得一提的是，在HTML5中可以使用“ form”属性作为输入元素：<table>&nbsp; &nbsp; <tr>&nbsp; &nbsp; &nbsp; &nbsp; <td>Id</td>&nbsp; &nbsp; &nbsp; &nbsp; <td>Name</td>&nbsp; &nbsp; &nbsp; &nbsp; <td>Description</td>&nbsp; &nbsp; &nbsp; &nbsp; <td>&nbsp;</td>&nbsp; &nbsp; </tr>&nbsp; &nbsp; <tr>&nbsp; &nbsp; &nbsp; &nbsp; <td><form id="form1"><input type="hidden" name="id" value="1" /></form></td>&nbsp; &nbsp; &nbsp; &nbsp; <td><input form="form1" type="text" name="name" value="Name" /></td>&nbsp; &nbsp; &nbsp; &nbsp; <td><input form="form1" type="text" name="description" value="Description" /></td>&nbsp; &nbsp; &nbsp; &nbsp; <td><input form="form1" type="submit" value="Save" /></td>&nbsp; &nbsp; </tr>&nbsp; &nbsp; <tr>&nbsp; &nbsp; &nbsp; &nbsp; <td><form id="form2"><input type="hidden" name="id" value="1" /></form></td>&nbsp; &nbsp; &nbsp; &nbsp; <td><input form="form2" type="text" name="name" value="Name" /></td>&nbsp; &nbsp; &nbsp; &nbsp; <td><input form="form2" type="text" name="description" value="Description" /></td>&nbsp; &nbsp; &nbsp; &nbsp; <td><input form="form2" type="submit" value="Save" /></td>&nbsp; &nbsp; </tr></table>尽管缺少JS和使用原始元素虽然很干净，但是不幸的是，这在IE10中不起作用。

Answer 3

我有一个类似的问题，这个问题在HTML中：表格表格？为我解决了。（不确定是否为XHTML，但可以在HTML5浏览器中使用。）您可以使用CSS将表格布局赋予其他元素。.table { display: table; }&nbsp;.table>* { display: table-row; }.table>*>* { display: table-cell; }然后，使用以下有效的html。<div class="table">&nbsp;&nbsp; &nbsp; <form>&nbsp; &nbsp; &nbsp; &nbsp; <div>snake<input type="hidden" name="cartitem" value="55"></div>&nbsp; &nbsp; &nbsp; &nbsp; <div><input name="count" value="4" /></div>&nbsp; &nbsp; </form></div>