重新加載IFRAME而不添加到歷史記錄

Question

我正在更改IFRAME的src以重新加載它，它的工作正常並在加載HTML時觸發onload事件。

但它增加了一個條目，我不想要的歷史。有什麼方法可以重新加載IFRAME，但不會影響歷史記錄？

Answer 1

您可以使用JavaScript location.replace：

window.location.replace('...html'); 

與 一個所提供網址替換當前文檔。從分配（）方法 區別是 ，使用更換後的（）當前 頁面不會被保存在會議 歷史，這意味着用戶將不能 能夠使用後退按鈕 導航。

Answer 2

像Greg上面說的那樣，.replace（）函數是如何做到這一點的。我似乎無法弄清楚如何回覆他的答案*，但訣竅是引用iFrames的contentWindow屬性。

var ifr = document.getElementById("iframeId"); 
ifr.contentWindow.location.replace("newLocation.html"); 

*剛學會了我需要更多的聲望來評論答案。

Answer 3

使用replace（）只是您自己的域iframe的一個選項。它無法在遠程站點上工作（例如：Twitter按鈕），並需要一些瀏覽器特定的知識才能可靠地訪問子窗口。

取而代之，只需刪除iframe元素並在同一個位置構建一個新元素。歷史記錄項目只在修改src屬性後纔會創建，因此請確保在追加前設置它。

編輯：JDandChips正確地提到您可以從DOM中刪除，修改並重新追加。不需要構建新鮮。

Answer 4

嘗試使用此功能，以取代舊的iframe有新的iframe這是從舊的複製：

function setIFrameSrc(idFrame, url) { 
    var originalFrame = document.getElementById(idFrame); 
    var newFrame = document.createElement("iframe"); 
    newFrame.id = originalFrame.getAttribute("id"); 
    newFrame.width = originalFrame.getAttribute("width"); 
    newFrame.height = originalFrame.getAttribute("height"); 
    newFrame.src = url;  
    var parent = originalFrame.parentNode; 
    parent.replaceChild(newFrame, originalFrame); 
} 

使用方法如下：

setIFrameSrc("idframe", "test.html"); 

這樣不會增加iframe的網址瀏覽器歷史記錄。

Answer 5

重新創建iframe的替代方法是從DOM中刪除iframe，更改src然後重新添加它。

在很多方面，這與replace()建議類似，但是當我用History.js嘗試這種方法並手動管理狀態時，我遇到了一些問題。

var container = iframe.parent(); 

iframe.remove(); 
iframe.attr('src', 'about:blank'); 

container.append(iframe); 

Answer 6

一種解決方案是使用object標籤，而不是iframe標籤。

更換此：

<iframe src="http://yourpage"/> 

通過這樣的：

<object type="text/html" data="http://yourpage"/> 

將讓您在不影響歷史更新data屬性。如果您使用聲明性框架（例如React.js），那麼您不應該執行任何命令性命令來更新DOM，這非常有用。在iframe和object之間的差異

更多細節：Use of Iframe or Object tag to embed web pages in another

Answer 7

最簡單，最快速裝載解決方案
使用window.location.replace加載頁面或幀時不更新歷史。

對於鏈接，它看起來是這樣的：

<a href="#" onclick="YourTarget.location.replace ('http://www.YourPage.com');"> 
The targeted Link</a> 

或

<a href="javascript:YourTarget.location.replace ('http://www.YourPage.com');"> 
The targeted Link</a> 

但如果你希望它不是從一個鏈接行爲，但在加載框架時自動採取行動那麼從iframe中您應該將其放入iframe文件正文部分：

onload="window.location.replace ('http://www.YourPage.com');" 

如果由於某種原因在onload不會在iframe中加載，然後在語法像這樣把你的目標框架名稱，而不是窗口：

onload="YourTarget.location.replace ('http://www.YourPage.com');" 

注意：對於此腳本全部onclick,onmouseover,onmouseout,onload和href="javascript:"將起作用。

Answer 8

使用replace方法繞過添加iframe的URL的歷史：

HTML：

<iframe id="myIframe" width="100%" height="400" src="#"></iframe> 

的JavaScript：

var ifr = document.getElementById('mIframe') 
if (ifr) { 
    ifr.contentWindow.location.replace('http://www.blabla.com') 
}