編集:これがクロムの問題であることがわかりました、コードはFirefoxで正常に動作します
htmlとしてフォーマットされた本を表示するiframeがWebページにあります。このiframe内にJavaScriptを挿入して、本をより動的にします(たとえば、文をクリックしたり、アニメーションを表示したりします)。iframeコンテンツは親ページと同じドメインにあります。
javascriptをiframeに挿入できますが、挿入されたjavascriptで関数を呼び出すとエラーが発生します。以下に、コードのさまざまなビットについて説明しました。
私の親ページのJavaScriptは次のとおりです。
function iframeLoaded()
{
var iFrameID = document.getElementById('preview-iframe');
var jsLink = iFrameID.contentDocument.createElement("script");
jsLink.src="/tests/iframeAPI.js";
jsLink.type = 'text/javascript';
iFrameID.contentDocument.head.appendChild(jsLink);
iFrameID.contentWindow.initialiseApi()
}
iframeを含むhtmlは次のとおりです。
<iframe id="preview-iframe" width="640" height="240" frameborder="0" src="./testpage.htm" onload="iframeLoaded()" scrolling="no"></iframe>
iframeAPI.jsの内容は次のとおりです。
window.initialiseApi = function() { alert("Hello world") }
ブラウザでiFrameのhtmlを見ると、iFrameAPI.jsタグがiframeヘッドに正常に挿入されていることがわかりますが、ページが読み込まれたときにアラートポップアップが表示されません。エラーは次の行に表示されます。
iFrameID.contentWindow.initialiseApi()
Uncaught TypeError: Object [object Window] has no method 'initialiseApi'
ただし、この行はブラウザのjavascriptコンソールで実行でき、アラートポップアップは正常に機能します。
どんな助けでも大歓迎です。
ありがとう、
ブライアン
編集:ページがロードされていることを確認するためにonloadイベントを試しましたが、まだ問題があります:
私の親ページのJavaScriptは次のようになりました:
function iframeLoaded()
{
var iFrameID = document.getElementById('preview-iframe');
var jsLink = iFrameID.contentDocument.createElement("script");
jsLink.src="/tests/iframeAPI.js";
jsLink.type = 'text/javascript';
iFrameID.contentDocument.head.appendChild(jsLink);
jsLink.onLoad= iFrameLoaded();
}
function iFrameLoaded()
{
alert("Iframe loaded"); // Alert works ok
var iFrameID = document.getElementById('preview-iframe');
iFrameID.contentWindow.initialiseApi(); // Same error message on this line
}