2013-03-06 128 views
1

我使用iframe來顯示HTML電子郵件內容,方法是通過JS將HTML字符串寫入其內容文檔。如果用戶點擊顯示的電子郵件中的鏈接,我不希望用戶在iframe之內導航。現在,我有以下選擇:防止IFrame導航

  1. 在一個新的瀏覽器窗口或選項卡(首選
  2. 防止所有的導航(不理想,只有在沒有其他左選項)
  3. 更好的選擇,我不打開鏈接你知道嗎?

我怎麼能完成這2個選項中的任何一個?

我知道HTML5推出​​財產,但遺憾的是,只有在工作和ChromeSafari,所以這不是一個選項。

+0

將所有鏈接轉換爲帶有onclick事件的跨度 – 2013-03-06 22:48:59

+2

如果您正在爲iframe文檔編寫html,您應該能夠在頭部添加一個元素。這將爲在iframe中點擊的鏈接打開一個新窗口或標籤。 – kennebec 2013-03-07 00:06:32

+0

不知道我可以在'base'中設置一個目標。你應該發佈這個答案。 – 2013-08-05 14:54:37

回答

0

您可以遍歷iframe中的所有鏈接並將target="_blank"添加到它們。

(請原諒我,但我只知道如何聯繫起來的例子在這個沒有它被標記的問題做到這一點在JQuery中非常抱歉):

$("#iframeID").contents().find("a").each(function() { 
    $(this).attr("target", "_blank"); 
}); 

例子:http://jsfiddle.net/yP7Nd/ - (忽略的位JS上面我的JQuery代碼,我不得不這樣做,以獲得一些IFrame內容加載正常)。

+0

我想這是最優雅的解決方案,但最終它不會阻止通過JS觸發的導航事件。也許我也應該刪除所有'onclick'等事件,但我不確定如何做到這一點,如果事件處理程序是在腳本加載到iframe之後添加的。 – 2013-03-06 23:46:11

0

你應該能夠與他們顯示的文本,以取代所有的鏈接,是這樣的:

var links = document.links; 
var i = links.length; 
var link, text, node; 

while (i--) { 
    link = links[i]; 
    text = link.textContent || link.innerText || ''; 
    node = document.createTextNode(text); 
    link.parentNode.replaceChild(node, link); 
} 

注意,links collection是活的,因此反向環路。

+0

這項工作將在所有瀏覽器上進行嗎? (我問你鏈接的文檔是Html 5,OP說他想避免這種情況)。 – webnoob 2013-03-06 23:10:15

+0

'document.links'是DOM 0,DOM方法都是版本2或更早版本,所有瀏覽器都是自NN或IE 5支持的。最近的是'textContent'或'innerText',但我認爲任何IE 6或Firefox 1.5以上版本都應該這樣做。 – RobG 2013-03-06 23:38:48

2

如果IFRAME是來自不同的產地,此方法將防止導航通過重置IFRAME來源,如果它的變化:

var $iframe = $('iframe'); 
    var iframeUrl = 'http://example.com/foo'; 
    var iframeLoaded = false; 
    $iframe.on('load', function() { 
    if (!iframeLoaded) { # Allow initial load of iframe. 
     iframeLoaded = true; 
     return; 
    } 

    # Reset iframe location back to original source to prevent navigation. 
    iframeLoaded = false; 
    $iframe[0].src = iframeUrl; 
    }); 

不幸的是,有沒有辦法來檢測開始的iframe負荷,因此在導航返回之前它會短暫閃爍新內容。另外,請注意,這會打破瀏覽器後退按鈕。