在后台打开新标签,将注意力集中在当前标签上 - Chrome

Posted

技术标签:

【中文标题】在后台打开新标签,将注意力集中在当前标签上 - Chrome【英文标题】:Open new tab in background leaving focus on current tab - Chrome 【发布时间】:2019-01-16 12:48:27 【问题描述】:

如何在 javascript 中执行 CTRL + 单击可在最新版本 Chrome (v68) 中运行的链接?

上下文 - 我正在运行一个 JavaScript 脚本,该脚本在一天中的特定时间打开某个选项卡(并在几分钟后关闭它)。我试图让它在后台打开选项卡,将焦点放在我正在使用的当前选项卡上。

以编程方式打开的选项卡即使在最小化时也会导致 Chrome 弹出,相当混乱。

我在 Stack Overflow 上找到的这些 old solutions 不适用于最新版本的 Chrome。

手动 CTRL + 单击链接可以达到我想要的效果(选项卡在后台打开)。这可以在最新版本的 Chrome 上以编程方式实现吗?


以下代码不再适用于最新版本的 Chrome..

const openNewBackgroundTab = (url) => 
  const anchor = document.createElement("a");
  anchor.href = url;
  document.body.appendChild(anchor);
  const evt = document.createEvent("MouseEvents");    
  // the tenth parameter of initMouseEvent sets ctrl key
  evt.initMouseEvent(
    "click", true, true, window, 0, 0, 0, 0, 0,
    true, false, false, false, 0, null
  );
  anchor.dispatchEvent(evt);

openNewBackgroundTab('https://***.com');

.. 新标签仍然获得焦点。


复制步骤:

打开窗口 1 并在控制台中执行:

let winStacko; setTimeout(() => winStacko = open('@987654322@'); , 30 * 1000); setTimeout(() => winStacko.close(), 2 * 60 * 1000);

执行脚本后 30 秒内打开窗口 2

期望的行为:

在后台选项卡打开然后关闭时,窗口 2 始终保持焦点。

【问题讨论】:

为什么需要这样做?我问这个是因为也许你正在尝试做的事情(也许是一些后台处理?)可以通过使用 Node.js 执行 javascript 代码来实现。通常,出于安全/垃圾邮件的原因,浏览器不允许以这种方式打开标签页。 @fsinisi90 是的,我知道。使用节点可以解决问题,但我必须从头开始重新编写系统。它在我的待办事项清单上,但仅限于当前解决方案中断的情况和情况。关于安全原因是的,我知道这一点,但插件毕竟还是这样做的。只有它将注意力集中在另一个选项卡上(实际上是最后一个使用的选项卡,而不是启动新选项卡的选项卡)。还是谢谢 打开新标签页对您有什么好处?例如,您是否可以改为在当前选项卡中打开 iframe?您正在寻找的内容可能无法仅通过 Javascript 实现,但可以通过 AutoHotKey 之类的操作系统脚本实现。 如果你想要后台处理使用网络工作者。在后台打开偷偷摸摸的标签是恶意应用程序总是尝试的。我讨厌这种情况发生,并在我看到标签打开的闪烁时尽快关闭它们。 @CertainPerformance 不,我考虑过 iframe 解决方案,但它对我不起作用。谢谢你,我会参加 AutoHotKey。 【参考方案1】:

部分使用 Chrome 插件解决了:强制背景选项卡

https://chrome.google.com/webstore/detail/force-background-tab/gidlfommnbibbmegmgajdbikelkdcmcl/related?hl=en

使用该插件,标签在后台打开,没有焦点。唯一的问题是窗口的最后使用的选项卡(可能与启动新选项卡的选项卡不同)仍然会在任何其他正在使用的应用程序前面弹出。

【讨论】:

不推荐使用扩展,因为它对客户端不友好,你不能告诉每个客户端都下载扩展。 @BarrJ 我不介意,我是唯一的用户。仅供个人使用。【参考方案2】:

在过去,你可以使用类似的东西来做到这一点:

if(window.focus == false)

    this.focus();

现在你必须使用额外的插件, 由于滥用者。解决方案:车窗翻转: 解决方案是创建另一个页面。 当您单击链接时,窗口关闭,它切换到打开刚刚关闭的窗口的页面,并将其位置更改为新页面。 第1页代码:

document.getElementById("myId").onclick = function()window.open("page2.html");window.close()

第2页代码:

window.open("previouspage.html");
window.location = "newpage.html";
//close the page
window.close();

我将此策略称为 “窗口翻转”。

【讨论】:

不错,但这更像是带有所有这些重定向和负载的“眼球翻转”。 @Anthony 我见过一些网站使用这种方法。我很久以前写过这个,所以我不太确定它现在是否有效。不过,我想我之前测试过它。【参考方案3】:

您可以尝试一种pop under,在新标签中打开相同的url,然后将当前标签的location.href更改为所需的新url。

window.open(window.location.href);
window.location.href = 'http://www.google.com';

【讨论】:

【参考方案4】:

如果您想将其用于个人用途,并且您不介意使用扩展程序,那么您可以编写自己的。

编写 chrome 扩展程序来实现您所需的行为实际上非常简单,您只需要知道如何从扩展程序中打开/关闭选项卡即可。 以下页面描述了整个API

这是一个例子:

1 - 创建一个manifest.json 文件,并请求tabs 权限


  "name": "blabla",
  "version": "0.1",
  "permissions": ["tabs"],
  "background": 
    "persistent": false,
    "scripts": ["background.js"]
  ,
  "browser_action": 
    "default_title": "Open a background tab every x time"
  ,
  "manifest_version": 2

2 - 在同一文件夹中创建background.js 脚本

const INTERVAL = 5000;
setTimeout(function()
    chrome.tabs.create(url: "https://www.***.com", active: false , tab =>
        setTimeout(function()
            chrome.tabs.remove(tab.id);
        ,INTERVAL);
    ); 
,INTERVAL);

You can download it from here too

注意:请注意这里的active参数,它定义了标签是否应该成为窗口中的活动标签。不影响 窗口是否聚焦

3 - 在 chrome 中使用扩展

    如果您使用的是下载链接,请解压压缩包 从 chrome 菜单导航到扩展程序 在右上角启用开发者模式 点击Load Unpacked按钮选择扩展文件夹 扩展会自动运行

【讨论】:

以上是关于在后台打开新标签,将注意力集中在当前标签上 - Chrome的主要内容,如果未能解决你的问题,请参考以下文章

Chrome快捷键统计

chorme快捷键

JS IOS Safari - 在 Go 按钮上打开新标签

Chrome浏览器快捷键

如何新打开一个标签页后,页面不跳转到新的标签页,而是停留在当前标签页?

react中路由跳转,当前页面上直接打开新标签页,重新开一个单独的页面