在addEventListener中查找源代碼iframe的周邊元素

Question

我有一個包含多個沙盒iframe的shell頁面。

例如

<div> 
    <div id="sb1"><iframe sandbox="allow-scripts" srcdoc="stuff here"/></div> 
    <div id="sb2"><iframe sandbox="allow-scripts" srcdoc="other stuff here"/></div> 
</div> 

當我收到來自其中一個iframe的消息時，我想知道父div（即＃sb1或＃sb2）。

我曾嘗試以下，但它不工作：

function receiveMessage(event) 
{ 
    // Follow line results in : Uncaught DOMException: Blocked a frame with origin ... 
    var parentDiv = $(event.source).parent(); 
} 

window.addEventListener("message", receiveMessage); 

有沒有一種方法來確定的iframe的父，而不必通過一個id來自iframe的消息嗎？

Answer 1

我能得到這個基於 「亞歷山大奧馬拉」 評論的工作。

function receiveMessage(event) 
{ 
    var parentDiv = $($('iframe').toArray().find(
     function(f) { 
     return f.contentWindow === event.source; 
     } 
    )).parent(); 
} 

window.addEventListener("message", receiveMessage); 

Answer 2

最近我需要知道切換模式的按鈕的ID。 'relatedTarget'爲我工作，它也可能適用於您的情況。

function receiveMessage(event) 
 
    { 
 
    var id = event.relatedTarget.id; 
 
    } 
 
    
 
    window.addEventListener("message", receiveMessage);