0

我想在多个浏览器选项卡上打开一个相同的页面。当我单击一个浏览器选项卡时，我希望 JavaScript 函数执行一次，一次！并不是说该函数被执行了 3 次，因为例如在 3 个浏览器选项卡上打开了一个相同的页面。

我努力了：

window.addEventListener("focus", () => {
     console.log(document.hasFocus());
});

如果您的光标专注于 Web 浏览器并不断在该浏览器上的选项卡之间切换，则此方法可以正常工作。

但是，如果您首先将光标放在该 Web 浏览器以外的其他东西上（例如计算机桌面或代码 IDE），然后单击 NON-ACTIVE 浏览器选项卡，则上述代码将被执行两次，一次由前一个活动选项卡，另一次是您刚刚单击的新活动选项卡。

那是我的问题。

当我单击 Web 浏览器选项卡时，如何只执行一次 JavaScript 代码？除了 JavaScript 代码之外的任何解决方案也都受到欢迎，例如跟踪像素或输入字段自动对焦事件，仅用于命名示例。我并不是说跟踪像素技术会有所帮助。我没有使用 jQuery。我正在使用 VueJs。

4

1 回答 1

0

在将其用于最终编码风格之前，您可能希望使用这种古老的方法和 JS 语法。有一些经典的香草味。它从不疼。 

document.body.onfocus = function(e){console.info(e.type)}
should work exactly as requested...
but since this behavior is somewhat tied to the BOM, some browser vendors (with idiosyncratic behaviors) might require some sort of enforced filtering,  Opera comes to mind. 

But it should be rock solid on all modern browsers including a bonus backward compatibility, as back as Windows 98 browser version. And\or the ancient and now probably forgoten NN 4.7. ( except for the console info event log, but that's not needed for the actual use anyway )

于 2020-02-19T10:42:07.420 回答