在後臺打開一個新標籤頁？

使用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

在後臺打開一個新標籤頁？

回答

相關問題