表行 onclick - 更改页面，或打开新标签

Posted

技术标签:

【中文标题】表行 onclick - 更改页面，或打开新标签【英文标题】：Table Row onclick - change page, or open new tab 【发布时间】：2013-06-21 23:53:15 【问题描述】：

我有一个包含行的表格，单击该表格时，会将用户带到一个页面，其中包含有关该行所描述的项目的更详细信息。不幸的是，它总是会更改当前页面，我们的用户希望能够通过鼠标中键/控制单击行，以便在需要时打开新选项卡。此选择适用于普通链接，但似乎不适用于我的 onclick。示例如下：

<html>
    <body>
        <table border='1'>
        <tr onclick='window.open("http://www.google.com")'>
            <td>Open Another Window</td>
        </tr>
        <tr onclick='location.href="http://www.google.com"'>
            <td>Change Current Page</td>
        </tr>
        </table>
    </body>
</html>

使用 onclick 事件模拟普通链接的最佳方法是什么，以便在不同的操作系统/浏览器中行为相同，我相信对于触发在新标签页中打开链接的触发因素有不同的绑定。

【问题讨论】：

如果您的表格行只有一个单元格，为什么要使用表格进行这种布局？这真的是为了显示表格数据吗？无论如何，这是以前问过的。这是一个很好的答案，但弹出窗口阻止会阻止您的标签打开：***.com/a/11384018/7569308 该示例只有一个单元格，但我的实际场景没有。我确实有一张数据表要显示。 【参考方案1】：

这对我有用：

<tr onclick="window.open('http://www.google.com','_blank')">

【讨论】：

您的解决方案很好地解决了部分问题，特别是如何在单击一行时打开新页面。 OP 希望他们的用户可以选择：单击在同一页面中打开，右键单击提供在新页面中打开的选项。【参考方案2】：

使用锚标记代替处理表格行的点击事件。 Ctrl+click 锚点的默认行为是在新窗口或选项卡中打开 href 属性中的 URL。如果您想在没有 Ctrl 按钮的情况下打开新选项卡或窗口，也可以使用锚点的 target 属性。

<td><a href="http://www.google.com" target="_blank">open another window or tab</a></td>

【讨论】：

重点是动作与表格行相关联（这就是我使用'onclick'的原因），而不是单元格或单元格内容。在 td 中创建一个“a href”链接很容易，但是如果用户单击行上的任何位置，我需要一个与之相关的操作。

以上是关于表行 onclick - 更改页面，或打开新标签的主要内容，如果未能解决你的问题，请参考以下文章

打开新选项卡onclick table row - plugin

更改密码或关闭标签后注销用户

怎样更改chrome的新建标签页至默认样式

如何使用 onclick="javascript:location.href" 打开新标签页？

点击页面的按钮，使之打开一个新窗口，加载一个页面的方法有哪些呢？

为啥以下脚本不打开新标签页或页面？