在HTML5中的元素（超链接）中包装表行 [英] Wrapping a table row in a element (hyperlink) in HTML5

问题描述

我正在尝试将表格行包装在a元素（超链接）中，以使整行可以点击。我正在使用HTML5 doctype，这应该允许这种事情，事实上我在链接中包装其他块级元素没有问题。事实上，围绕整个表包装元素似乎是有效的。

I'm trying to wrap a table row in an "a" element (hyperlink) in order to make the whole row clickable. I'm using the HTML5 doctype, which should allow for this sort of thing and in fact I've had no problem wrapping other block-level elements in links. In fact, wrapping an a element around a whole table seems to work.

标记如下：

<table>
    <tbody>
      <a href="#">
          <tr>
              <td>25 Nov 2010</td>
              <td>Active</td>
          </tr>
      </a>
   </tbody>
</table> 

推荐答案

来自 HTML5规范：

可以使用元素 tr 的上下文：

Contexts in which element tr can be used:

• 作为thead的孩子元素。


• 作为tbody元素的子元素。


• 作为tfoot元素的子元素。


• 作为表元素的子元素，在任何标题，colgroup和thead元素之后，但仅当没有tbody元素是表元素的子元素时。

• As a child of a thead element.
• As a child of a tbody element.
• As a child of a tfoot element.
• As a child of a table element, after any caption, colgroup, and thead elements, but only if there are no tbody elements that are children of the table element.

这意味着你不能在 a 元素中继承 tr 。
在你的情况下，我会选择使用Javascript onclick。或者，您可以在每个行中放置相同的锚元素 td s。

That means you cannot inherit tr in a element. In your case I would go with Javascript onclick instead. Alternatively, you can put the same anchor element in each of the rows tds.

希望这有帮助。

这篇关于在HTML5中的元素（超链接）中包装表行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！