Question

我想在列标题上方创建一个带有搜索文本框的表格

<table>
   <thead>
      <tr><td><input type="text" /></td><td><input type="text" /></td></tr>
      <tr><td>Mother</td><td>Father</td></tr>
   </thead>
   <tbody id="search-results">
      <!-- to be populated by AJAX response -->
   </tbody>
</table>

表单元素是否允许这样？

<form>
  <thead>...</thead>
</form>

或

<thead>
  <form>...</form>
</thead>

或者哪个方向？

此外，<input type="hidden" />可以放在表单标记之间的任何位置吗？

Answer 1

在表格中，<form>只能是内容在<td>，<thead>，<tfoot>，<th>内的表格内部的位置或<caption>。或者整个表格可以在<form>内，但不是您展示它的方式之一。

如果您没有使用内置表单提交功能，您还可以在任何<input>中使用<td>标记或其他表单元素等表单元素，而不将其括在<form>中

Answer 2

您应该将整个<table>元素包装在<form>中，除了内部<table>，<th>之外，您不能在<td>内放置任何与表格无关的内容和<caption>元素。因此，如果您不想将整个表单放在<td>单元格中，则应将整个表格包装在<form>中。

<input type="hidden">标记就像任何其他输入标记一样 - 它们必须包含在<td>和其他内容标记内。

Answer 3

这是关于html5的规范，你会发现只允许嵌入到表格中的表格here

这是使用thead的正确形式：thead tutorial。

如果链接被丢弃，将从该链接复制以下内容以保留答案：

如果你愿意，你可以像这样离开你的桌子，但如果你愿意的话欣赏高度语义结构的内容我很高兴向您介绍该元素。元素构建表格中的标题，这告诉浏览器是什么例如每列包含。元素结构全部内容，以便浏览器知道实际内容是什么表是。使用与以前相同的例子，和要使用的元素如下：

<table border="1" width="100%">
        <thead>
                <tr>
                        <td>Row 1, cell 1</td>
                        <td>Row 1, cell 2</td>
                        <td>Row 2, cell 3</td>
                </tr>
        </thead>
        <tbody>
                <tr>
                        <td>Row 2, cell 1</td>
                        <td>Row 2, cell 2</td>
                        <td>Row 2, cell 3</td>
                </tr>
                <tr>
                        <td>Row 3, cell 1</td>
                        <td>Row 3, cell 2</td>
                        <td>Row 3, cell 3</td>
                </tr>
                <tr>
                        <td>Row 4, cell 1</td>
                        <td>Row 4, cell 2</td>
                        <td>Row 4, cell 3</td>
                </tr>
        </tbody>
</table>

您还可以在表单标记中的任何位置使用隐藏输入。

表元素中允许的表单元素在哪里？

3 个答案: