3

編集:これがクロムの問題であることがわかりました、コードは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
}
4

4 に答える 4

1

コンテンツが読み込まれる前に関数を使用しようとしているようです。

代わりにこれを試してください:

var t = setTimeout(iFrameID.contentWindow.initialiseApi(),500);

これにより、ページ タイムをロードする機能を試行する前に 0.5 秒待機します。遅延時間はミリ秒単位で指定されます。

さらに良い方法は、Jquery とその ready() メソッドを使用することですが、これには jquery ライブラリもロードする必要があります。私の意見では、http://api.jquery.com/ready/を参照してください。

次のようなものを試してみてください:

$("body",iFrameID.contentWindow.document).ready(iFrameID.contentWindow.initialiseApi())
于 2012-07-31T17:40:27.773 に答える
0

スクリプトをロードする機会を与えずに、すぐに実行しています。onloadイベントをスクリプトブロックに接続し、メイン関数を実行します。

于 2012-07-31T17:27:40.000 に答える
0

iFrameに含まれているページで、次のようにしてメインページにアクセスしてみてください。

window.parent.xyz = something;

somethingメインページに表示したいものはどこにありますか。関数または関数のオブジェクトである可能性があります。これで、メインページで次のことができます。

something(); // or something.somefunction();

ウィンドウ参照を送信することもできると思いますが、私はそれを試していません。

于 2012-07-31T17:28:33.997 に答える
0

最も簡単な方法は、iframeAPI.js が読み込まれるとすぐに呼び出されるので、iframeAPI.js 自体で initialiseApi 関数を呼び出すことです。iframeAPI.js は次のようになります。

function initialiseApi() { 
    alert("Hello world"); 
}
initialiseApi();

コールバックやタイムアウトは必要ありません。

于 2015-08-12T19:16:16.457 に答える