<a> 标签中的 HTML 表格答案

【问题标题】：HTML table in <a> tag<a> 标签中的 HTML 表格
【发布时间】：2014-01-30 04:49:26
【问题描述】：

是否有可能以某种方式将整个 HTML 表格放在一个 href 链接中？

类似：（在 IE 中不起作用）

    <td class="order_confirm">
        <a href="ssss">
            <div>
                <table width="100%" border="0" cellspacing="6" cellpadding="0">
                  <tr>
                    <td><img src="design/img/icon_ok.png" width="22" height="22" alt="objednat" /></td>
                    <td width="0" class="order_confirm_order">OBJEDNAT</td>
                    <td width="100%" class="order_confirm_order_desc">Záväzne si objednávam uvedený tovar a súhlasím s platobnými,<br />
                      dodacími a obchodnými podmienkami prevádzkovateľa.</td>
                  </tr>
                </table>
            </div>
        </a>
    </td>

我知道这不是最佳实践，但是，我并没有真正看到使用非表格布局的解决方法......因此，非表格布局的解决方案也将是我可以接受。

【问题讨论】：

"将整个 HTML 表格放在一个 href 链接中"????????让我们先告诉我们您想做什么。
您有一个宽度为 100% 的 td，而该行中还有其他 tds。
它正在进行中@PeeHaa，不要专注于那个:)
@PeeHaa - 在链接中获取整个表格以用作按钮......如果可能......如问题所述 - 我知道这不是最佳做法，但也许有某种的解决方法...如果没有，我将不得不使用 divs...
不使用表格完全可以实现您想做的事情。

标签： html href

【解决方案1】：

将 div 或 table 放在 a 中是不正确的。（有关更多信息，请参阅 selfhtml）。

你可以这样做：

<div onclick="document.location.href = 'new location';">....</div>

【讨论】：

为此+1，但是，我知道它，我不想使用它，我希望有另一种选择......
+1 用于提出后来在另一个答案中重复并接受的方法...

【解决方案2】：

在 HTML 5 中，您可以将块元素放在内联元素中，这样它就可以工作了。

对于任何不支持 HTML 5 的浏览器，或者如果您的页面中没有 HTML 5 文档类型，标记将会中断，div 和 table 将在链接之外结束.

【讨论】：

是的，好吧，doctype 现在是 XHTML 1.0 Transitional，但它正在进行中，所以我可能会更改为 HTML5。切换文档类型会不会有其他问题？从未使用过 HTML5...
@MichalPlško：嗯，最大的问题是不支持 HTML 5 的浏览器。
他们会“回滚”到 HTML 4.1 还是什么？
@MichalPlško：是的，不能识别文档类型的浏览器会退回到它认为可能的版本。自然，他们不能“退步”到浏览器发布时不存在的版本。

【解决方案3】：

如果您希望将整个表格作为链接，您可以模拟 css 和 javascript。

本例使用jQuery:

<style>
    #big-link {
       cursor: pointer;
    }
</style>

<script>
$(function() {
    $("#big-link").click(function() {
        window.location.href = "ssss";
    });
});
</script>
<div id="big-link">
    <table>
         ...
    </table>
</div>

【讨论】：

哦，不错的选择，没想到这个... +1 -thanx
也许你应该编辑答案，以便清楚这是 jQuery - 而不仅仅是 JS...（我知道，但其他人可能不会...）
@MichalPlško：这与 user1150525 提出的解决方案相同，您说您不想想要使用...
@Guffa - 不是真的，他提出了一个内联 java 脚本，这是 jQuery ......我可以把它分成一个外部文件，这对我来说是一个很大的优势......内联 JS 不能被分离到一个外部文件，这就是我不想使用它的原因......
我不是作为版主，而是作为 Stack Overflow 的长期用户对您的答案进行了编辑。许多人只是剪切和粘贴已接受答案中给出的示例，然后想知道为什么它们不起作用。是的，有些人不知道 jQuery 是什么，你需要考虑这一点，就像你需要考虑到 IE6 用户不知道任何更好的东西一样，尽可能。在这种情况下，这样的会计是可能的，所以我添加了它:) 请记住，OP 不是你教的唯一一个。

【解决方案4】：

使用html4 事件属性，您可以使table 本身成为anchor-tag。

<table
    style="cursor:pointer" 
    onMouseover="window.status='http://www.stackoverflow.com/'" 
    onMouseout="window.status=''" 
    onMouseup="window.location='http://www.stackoverflow.com/'" 
    width="500" height="500">

【讨论】：