在iframe上識別動作

因此，我有一個iframe，並且我希望能夠在iframe中的某個特定按鈕被點擊時做類似alert的操作。但是，下面的代碼其實並沒有工作在iframe上識別動作

$('.class_name').click(function(){ 
    alert('Clicked');  
});

，它甚至不會alert時的iframe點擊（這是相同的代碼上面，但如果.class_name變得iframe）。

我看着this question的解決方案，它仍然沒有工作！

This is a jsfiddle應該證明問題很好。

所以我的問題是：爲什麼不能通過jquery識別iframe中的任何內容以及實際的iframe是否被點擊？

編輯：

我明白，我不能在不同域的iframe溝通，所以我的jsfiddle不會工作......但它並不在那裏，我收留了它在同一個網站上工作域作爲iframe ...

來源

2013-06-20 Ryan Saxe

如果您的iframe來自不同的域，如在您的小提琴中，那麼您的JavaScript代碼根本無法訪問其內容，對不起！

作爲@Max poins出來，可以使用postMessage()或網址片段劈在不同的域中使用的iframe進行通信，如果有在該iframe來處理從該側起的通信的代碼。

使用來自tumblr.com的iframe，您可以檢查他們的文檔以查看它是否討論瞭如何在iframe中使用此頁面並跨越域障礙與其通信。

現在，如果您將相同的域的iframe作爲您的頁面進行討論，那很簡單。給定名爲myframe的變量中的iframe元素，可以使用myframe.contentWindow來獲取其window對象和myframe.contentWindow.document以獲取其document對象。從那裏你可以做你需要的東西。例如：

var $myframe = $('#myframe'), 
    myframe = $myframe[0], 
    myframewin = myframe.contentWindow, 
    myframedoc = myframewin.document; 

$(myframedoc).find('a').on('click', function() { 
    alert('Clicked!'); 
});

您仍然可以選擇使用主網頁的jQuery的副本訪問在iframe事情有些麻煩，但應該與最新版本更好的運氣。最糟糕的情況是，您可以使用本機DOM事件和方法，但jQuery在this updated fiddle中工作。

這個小提琴使用document.write將內容放在iframe中，但訪問該框架的jQuery代碼也是相同的。當然要注意的一件事是，當您嘗試訪問iframe時，iframe是否已完全加載。

我認爲你可以聆聽到包含頁的iframe元素上load事件，但最壞的情況下，你可以使用setTimeout()或setInterval()，等待你正在尋找變得可用的元素。

來源

2013-06-20 22:03:56

更新了我的答案... ...的jsfiddle可能無法正常工作，但它仍然是給我的麻煩與一個網站與iframe相同的域。此外，它應該仍然能夠在iframe本身被點擊時發出警報，對嗎？因爲這與iframe的內容無關！ –

請不要使用Google作爲參考。指向一個特定的網站（維基百科應該沒問題） –

謝謝！希望這有效:) –

因爲iFrame是一個完全不同的框架 - 它完成了安全考慮。例如，想象一下，如果您可以在iFrame中加載銀行登錄頁面，並使用js來獲取字段值。

隨着特別是不同的領域，這是更難與JS-溝通這應該讓你開始：How to communicate between iframe and the parent site?

來源

2013-06-20 22:04:34 Max

更新了我的答案... jsfiddle可能無法正常工作，但它仍然給我帶來與iframe相同的域名的問題 –

此外，它應該仍然能夠在iframe本身爲點擊，對吧？因爲這與iframe的內容無關！ –

@RyanSaxe no。該點擊屬於iFrame文檔，不屬於您的。 –

在iframe上識別動作

回答

相關問題