2011-12-09 5 views
0

私は知っています、ここでそれに関する多くの答えられた質問があります。私の状況はちょっと違っていますが、私はまだ答えを見つけることができませんでした。ページが完全に読み込まれているかどうかを確認する方法(スクリプトとすべて)?

ページが完全に読み込まれた後にメッセージを表示しようとしています。 $(document).ready, document.readyStateChangeを使用すると、私は気にしません。

ドキュメントは、実行が必要なスクリプトの途中ですぐに準備ができています。私はwindow.onloadでそれをやろうとしましたが、それはjQueryと同等ですが、画像/要素が表示される前にメッセージが表示されます。それが実行されるのを待つ方法はありますか?メッセージだけが表示されますか? (同じページで何度もやる必要があるかもしれないことに注意してください)。

ありがとうございます!

答えて

0

サウンドはdocument.readyイベントにバインドするのではなく、最初に実行する必要があるスクリプトのコールバックとして実行する必要があります。コードを投稿することができれば、私はもっと助けることができるかもしれません。

0

bianca、なぜ実行する必要があるスクリプトからメッセージを読み込もうとしないのですか?スクリプトの最後にメッセージを表示して、実行する必要があるスクリプトが完了したことを確認します。

0

Javascriptは、書き込まれた順に実行されます。私は、あなたの現在のコードがHTMLがロードされた後に実行されると推測します(つまり、window.onload)。もしあなたのメッセージがJavascriptで最後に呼び出されたものであれば。

唯一の例外は、非同期にXMLHttpRequestを呼び出すと、 "false"に設定された変数を持ち、そのXMLHttpRequestが終了したときにその変数を "true"に設定したい場合です。次に、その変数がtrueのときにlistenするsetTimeoutを使用できます。

0

window.onloadが解決策です。 DOMが準備完了状態にあり、すべてのリソースがブラウザにロードされている場合は、window.onloadがトリガーされます。言い換えると、ブラウザのサークルが回転しなくなると起動します。

0

ページが本当に読み込まれたことを確認することは、必ずしも容易ではありません。特にAjax経由でコンテンツに依存するページや、非同期に読み込まれる他のアセット(各アセットは、例えば画像のような他のアセットとは独立して並行して読み込むことができます)。このような状況に近づいへ

私の提案:

は、いくつかのグローバル繰延オブジェクト(約束)を作成し、それだけで、それが「準備完了」であるに依存しているすべてのものの後に解決されますことを確認してください。

最小例:

// start your web app code.. 
var p1 = new Promise(); 
var p2 = new Promise(); 
var p3 = new Promise(); 

// when all dependencies are done loading, means the page is truly "ready" 
Promise.all([p1, p2, p3]) 
    .then(() => { 
     // page done loading 
    }); 

// somewhere in the code...wait for Ajax content to load 
// and resolve "p1" after the content has loaded 
p1.resolve(); 

// somewhere in the code...wait for some other Ajax content to load 
// and resolve "p2" after the content has loaded 
p2.resolve(); 

// somewhere in the code...wait for all the images to load 
// (http://stackoverflow.com/a/1977898/104380) 
// and resolve "p3" 
p3.resolve(); 

ポイントは手動で非同期完全にロードされているされているすべてのさまざまな部分を確認する必要があるということです。面倒な作業ですが、非常に堅実な解決策です。

関連する問題