javascript - 持久保存名为 window.open() 的选项卡

标签 javascript html settimeout window.open

背景。我正在 Firefox 中工作。我正在创建一个文档页面,其中包含指向我的 Apache Solr 实例的示例查询(作为超链接),该实例在后台运行。

问题。我发现,当我通过超链接(不是输入元素)向 Solr 发送查询时,我需要 (1) 让搜索页面加载; (2)然后执行查询。

此外,我发现我为示例查询重用的命名页面(窗口/选项卡)需要集中精力才能正常工作。

因此,我(1)打开搜索页面; (2) 等待该页面完全加载,然后打开查询 URL。

我创建了一个最小的示例来显示该问题,并调用 example.com 来代替我的搜索页面(1.,上面);然后一段时间后,调用第二个 URL(Google 或 Bing,代替上面 2 中的搜索查询)。

我相信这个问题与此处接受的答案中的最后一句有关:

check if a browser tab is already open so I don't make extra tabs

...一旦用户刷新页面,该引用就会丢失。

在我的代码中,如果我使用

my_window = window.open("", "my_tab");

然后执行setTimeout(),并打印到控制台。

如果我使用

my_window = window.open("", "my_tab").focus();

然后(根据上面的 StackOver 流程​​链接)我相信 my_window 对象丢失了,因此 setTimeout() 永远不会执行。

问题:如何保留命名窗口/选项卡对象 (my_window)? 本地存储? ...


JSFiddle: https://jsfiddle.net/vstuart/1yfeqkz9/8/


<html lang="en">
<head>

<script>
  function foo(obj) {
    globalThis.link = (obj.getAttribute("href"))
    console.log('[foo] link:', link);

    // ISSUE HERE:
    // my_window = window.open("", "my_tab").focus();
    // SOLUTION HERE, per accepted answer, below:
    my_window = window.open("", "my_tab");
    my_window.focus()
    
    my_window.location = "https://example.com/";

    setTimeout("bar(link)", 2000);
    return false;
    }

  function bar(link) {
    console.log('[bar] link:', globalThis.link);
    my_window.location=globalThis.link;
  }
</script>
</head>

<body>

<ul>
  <li><p><a target="my_tab" onclick="foo(this); return false;" href="https://dogpile.com/">Dogpile.com</a></p></li>

  <li><p><a target="my_tab" onclick="foo(this); return false;" href="https://duckduckgo.com/">DuckDuckGo.com</a></p></li>
</ul>

</body>
</html>

最佳答案

您可以在赋值后的行调用.focus()

my_window = window.open("", "my_tab")
my_window.focus()

当您使用时

my_window = window.open("", "my_tab").focus();

问题是 my_window 被分配了返回值 focus ,不是 window.open 的返回值.

关于javascript - 持久保存名为 window.open() 的选项卡,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/76020358/

相关文章:

javascript - 使用 AJAX 调用 Flask API

javascript - 为什么这个正则表达式在 javascript 函数之外工作而不是在它的内部?

javascript - ngCordova 捕获 - 属性 'capture' 未定义

html - 如何使用 HTML 和 CSS 在页面底部制作 2 个固定页脚?

Javascript 如何停止 setTimeOut

Javascript - 在 DOM 元素上制作原型(prototype)

php - 如何在 PHP 脚本中为特定 IP 地址生成唯一的许可证 key ?

css - float 元素不会粘在父包装器 div 的顶部

javascript - 减少在特定时间段内触发特定次数的超时之间的时间

javascript - XHR 请求的 setTimeout