親から子へのpostMessageとの通信を行います。iFrame

Question

親ウィンドウから子iFrameへの通信に問題があります。しかし、反対側では、すべてが完璧に動作します。ここ は、私がのpostMessage機能を発射するために、CHIL iframeオブジェクトを取得する方法である：

私は、次の取得、彼はコンソールint型、それを印刷

var iFrame = document.getElementById('Frame').contentWindow; 

：

Window {parent: Window, opener: null, top: Window, length: 0, frames: Window…} 

とき私は次のようにpostMessage関数に進みます：

iFrame.postMessage("message", "http://contoso.com"); 

それは私にエラーを示していますrページを読み込むとき：iFrame.postMessageは関数ではありません。私は、コンソールでのpostMessageを実行すると は、私が間違って何をやっている未定義

を取得しますか？

Answer 1

この

var iFrame = document.getElementById('Frame'); 
iFrame.contentWindow.postMessage("message", "http://contoso.com"); 

を試してみてください私もこの問題を抱えていました。このウェブサイトから解決策を見つけたhttps://www.viget.com/articles/using-javascript-postmessage-to-talk-to-iframes

Answer 2

以下のコードも動作します。

$('#id')[0].contentWindow.postMessage("hello world",targetOrigin);

jQueryのセレクタとのdocument.getElementByIdの差があります。

Document.getElementByIDはHTML DOMオブジェクトを返します。
jQueryセレクタがjQueryオブジェクトを返します。

詳細については、下記のリンクをご覧ください。 document.getElementById vs jQuery $()