Chrome 在后台打开新标签页？

zrfyljdw 于 2023-06-27 发布在 Go

关注(0)|答案(6)|浏览(599)

使用JavaScript，我想在不同的选项卡中打开一个新页面，但仍然关注当前选项卡。我知道我可以这样做：

open('http://example.com/');
focus();

但是，当我在chrome中这样做时，它会 Flink 一小会儿新的标签页，然后再切换回当前的标签页。我想避免这种情况。
该应用程序是一个个人书签，所以它只需要在最新的Chrome中工作。

google-chrome

来源：https://stackoverflow.com/questions/10812628/open-a-new-tab-in-the-background

6条答案

按热度按时间

a0zr77ik1#

**更新：在Google Chrome的41版本中，initMouseEvent的行为似乎发生了变化，因此这个答案不再有效。

这可以通过在动态生成的a元素上模拟ctrl + click（或打开后台选项卡的任何其他键/事件组合）来完成，该元素的href属性设置为所需的url

运行中：fiddle

function openNewBackgroundTab(){
    var a = document.createElement("a");
    a.href = "http://www.google.com/";
    var 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);
    a.dispatchEvent(evt);
}

仅在Chrome上测试

赞(0）回复(0）举报 2023-06-27

hk8txs482#

这在所有流行的浏览器上都很好用：

function openNewBackgroundTab(){
    var a = document.createElement("a");
    a.href = window.location.pathname;
    var 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);
    a.dispatchEvent(evt);
}

var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
if(!is_chrome)
{
    var url = window.location.pathname;
    var win = window.open(url, '_blank');
} else {
    openNewBackgroundTab();
}

赞(0）回复(0）举报 2023-06-27

l0oc07j23#

据我所知，这是由浏览器设置控制的。换句话说：用户可以选择他们是否愿意在后台或前台打开新标签。此外，他们可以选择是否新的弹出窗口应该在新的标签或只是打开... popup.
例如，在Firefox首选项中：

注意最后一个选项。

赞(0）回复(0）举报 2023-06-27

thtygnil4#

我用一种非常简单的方式完成了你想要的。它在Google Chrome和Opera中非常流畅，在Firefox和Safari中几乎完美。未在IE中测试。

function newTab(url)
{
    var tab=window.open("");
    tab.document.write("<!DOCTYPE html><html>"+document.getElementsByTagName("html")[0].innerHTML+"</html>");
    tab.document.close();
    window.location.href=url;
}

小提琴：http://jsfiddle.net/tFCnA/show/
说明：
假设有窗口A1和B1以及网站A2和B2。
我不是在B1中打开B2然后返回A1，而是在A1中打开B2并在B1中重新打开A2。
（另一个使它工作的原因是，我没有让用户重新下载A2，参见第4行）
你唯一 * 可能 * 不喜欢的是新标签页在主页之前打开。

赞(0）回复(0）举报 2023-06-27

xdyibdwo5#

以下是MountEvent中的示例

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Example</title>
</head>
<script>
  function newTab() {
    const a = document.createElement('a');
    a.href = 'https://example.com/';
    a.target = '_blank';
    const e = new MouseEvent('click', {
      ctrlKey: true, // for Windows or Linux
      metaKey: true, // for MacOS
    });
    a.dispatchEvent(e);
  }
</script>

<body>

  <button onclick="newTab()">new tab</button>
</body>

</html>

赞(0）回复(0）举报 2023-06-27

prdp8dxp6#

下面是一个完整的示例，用于在具有焦点的新选项卡上导航有效URL。
HTML：

<div class="panel">
  <p>
    Enter Url: 
    <input type="text" id="txturl" name="txturl" size="30" class="weburl" />
    &nbsp;&nbsp;    
    <input type="button" id="btnopen"  value="Open Url in New Tab" onclick="openURL();"/>
  </p>
</div>

CSS：

.panel{
  font-size:14px;
}
.panel input{
  border:1px solid #333;
}

JavaScript：

function isValidURL(url) {
    var RegExp = /(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/;

    if (RegExp.test(url)) {
        return true;
    } else {
        return false;
    }
}

function openURL() {
    var url = document.getElementById("txturl").value.trim();
    if (isValidURL(url)) {
        var myWindow = window.open(url, '_blank');
        myWindow.focus();
        document.getElementById("txturl").value = '';
    } else {
        alert("Please enter valid URL..!");
        return false;
    }
}

我还使用http://codebins.com/codes/home/4ldqpbw上的解决方案创建了一个bin

赞(0）回复(0）举报 2023-06-27

我来回答

Chrome 在后台打开新标签页？

6条答案

相关问题

热门标签

最新问答