在后台打开一个新标签页？

使用JavaScript，我想在不同的选项卡中打开一个新页面，但仍然关注当前选项卡。我知道我能做到这一点是这样的：在后台打开一个新标签页？

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

但是，我这样做时在Chrome中，它切换回当前选项卡之前闪烁了一下新的选项卡。我想避免这种情况。

该应用程序是一个个人书签，所以它只能在最新的Chrome中工作。

来源

2012-05-30 st-boost

http://www.w3schools.com/js/js_ex_browser.asp尝试这些 –

的@ jolly.exe谢谢，但这些都不暂时避免在Chrome中显示了新的一页。 –

似乎这个问题的副本http://stackoverflow.com/questions/6897430/prevent-window-open-from-focusing解决方案是使用Chrome扩展api。 –

UPDATE：通过谷歌浏览器的版本41，initMouseEvent似乎有改变的行为。

这可以通过用其href属性设置为所需的url

在动作动态生成a元件上模拟ctrl + click（或任何其它键/事件组合可打开的背景标签）来完成：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测试

来源

2012-07-09 04:35:39 Amro

太棒了，我想我们明白了。不过，一个重要的注意事项是：在OSX上，metaKey值必须为真。 –

另一个注意事项：除非设置了'a.target ='_ blank';'，否则这将不适用于具有定位文字的网址。 –

这非常有帮助。你真棒：D – iAnuj

-3

下面是一个完整的示例，用于在有新焦点的新选项卡上导航有效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

来源

2012-07-03 12:03:46 gaurang171

谢谢，但我认为你误解了我的问题。我希望开幕页面成为最后聚焦的那个页面，而不是新的页面 - 问题是我怎样才能避免在一段时间内显示新的页面。 –

至于我记住，th是由浏览器设置控制的。换句话说：用户可以选择是否要在后台或前台打开新选项卡。他们也可以选择是否在新选项卡中打开新的弹出窗口或弹出窗口。

例如在Firefox的偏好：

Firefox setup example

通知的最后一个选项。

来源

2012-07-03 14:59:08 demee

谢谢，但我希望能够从网站内部控制某些内容，因为我不希望这会影响其他网站。（另外，ctrl/cmd + click也是一样的 - 我一直都在使用它） –

这不适用于javascript，仅适用于浏览器设置。 – Lin

-3

我以一种非常简单的方式完成了你正在寻找的任务。它在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行）

^{你可能不喜欢的唯一的事情就是新标签在主页面之前打开。}

来源

2012-07-04 23:14:26 Mageek

谢谢，这是一个聪明的做法。然而，它存在许多问题，包括clobbering事件监听器，浏览器历史记录不匹配，潜在地改变文档类型以及丢弃html元素上的属性等等，更不用说它实际上“不是在不同的页面中打开新页面标签”。 –

为什么它不在另一个选项卡中打开新页面？ – Mageek

从技术上讲，它在相同的标签中打开新页面，并在新标签中打开相同的页面。我知道这只是语法，并不重要 - 重要的是，这会将页面与历史分离（打破后退按钮），并使Chrome浏览器等难以跟踪标签层次结构。 –

THX这个问题！适用于所有流行浏览器：

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(); 
}

来源

2014-04-04 09:06:27 user2837849

来自MDN“已弃用此功能已从Web标准中删除，尽管有些浏览器可能仍支持此功能，但它正在被删除，不要在旧项目或新项目中使用此功能。使用它的页面或Web应用程序可能随时中断。“ – BaSsGaz

试试这个。它适用于Chrome，它也从Chrome扩展工作。以上所有都不适合我。

chrome.tabs.create({ url: "http://www.google.com/", selected: false });

来源

2017-02-01 10:23:38

给我这个错误：'未捕获的类型错误：无法读取未定义的属性'创建' – Xerus

@Xerus上述答案只适用于铬扩展的情况。所以上述语句将在Chrome扩展的后台页面中工作。 chrome.tabs.create是一个铬扩展api –

仅用于Chrome扩展的代码，不适用于js。 – Lin

在后台打开一个新标签页？

回答

相关问题