时间戳

首页 > 解决方案 > 该网站如何在没有任何权限的情况下控制用户在选项卡之间的导航？

javascript - 该网站如何在没有任何权限的情况下控制用户在选项卡之间的导航？

问题描述

在Outlook Web App上，单击“日历”链接会在新选项卡中打开。到目前为止一切正常。

日历链接

单击此新选项卡上的“邮件”选项卡时会发生有趣的部分；它以某种方式将焦点重定向到原始选项卡！这两个选项卡现在“绑定”在一起，单击每个选项卡中的邮件/日历会使另一个选项卡成为焦点。

我假设这是通过一些 JavaScript 魔法完成的。有趣的是，重新打开其中一个选项卡会失去这种“绑定”状态，所以我假设它与新选项卡的打开方式有关。我确实尝试过研究如何通过网站控制标签，但所有结果都表明这是不可能的。

如果没有视频/ gif，很难完全解释这种行为，但我的问题本质上是：

网站如何控制浏览器中选项卡之间的导航？

我正在使用 Chrome x64 71.0.3578.98。

标签： javascriptoutlooktabs

解决方案

如果一个窗口打开另一个窗口，您可以使用以下方法在它们之间来回切换焦点：

// Open new window from current window
let yourTabName = window.open("google.com");

// Focus parent window, from new window
window.opener.focus();

// Focus new window, from parent window
yourTabName.focus();

这是一个示例小提琴（确保您允许弹出窗口）：https ://jsfiddle.net/pg74mxvd/

如果你运行小提琴，你会看到它打开了一个新标签。然后，您可以返回小提琴选项卡并单击 HTML 按钮，焦点应转到刚刚打开的选项卡。

我怀疑这就是他们正在做的事情，因为当您单击“日历”按钮时，您实际上是从现有窗口打开一个新窗口，然后您可以调用上述方法。

推荐阅读