web-dev-qa-db-ja.com

$(window).load()/ window.onloadイベントがすでに発生しているかどうかを確認するにはどうすればよいですか?

別のスクリプトを介して動的に挿入されているスクリプトがあります。そのスクリプトのコードは、ページ上の画像をすべてロードする必要があるため、$(window).load()イベント内にラップされています。一部のブラウザでは正常に動作しますが、コードが実行されるまでにページの読み込みがすでに完了しているため、起動しないように見えるブラウザもあります。

JQueryまたはJavaScriptを使用して、ページの読み込みがすでに完了しているかどうかを確認する方法はありますか? (画像を含む)

この状況では、元のドキュメントのonloadイベントにアクセスできません(ロードされたスクリプトを介して変更することを除いて-しかし、同じ問題が発生するようです)。

任意のアイデア/ソリューション/アドバイスをいただければ幸いです!

12

タイムアウトを介して呼び出されるハンドラーを設定して、画像のプロパティが使用可能かどうかを確認することができます。 loadイベントハンドラーでタイマーをクリアして、ロードイベントが最初に発生した場合に、タイマーが起動しないようにします。プロパティが使用できない場合、loadイベントはまだ発生しておらず、ハンドラーが最終的に呼び出されることがわかります。そうである場合は、ハンドラーが設定される前にロードイベントが発生したことがわかり、簡単に続行できます。

擬似コード

 var timer = null;
 $(function() {
    $(window).load( function() {
        if (timer) {
           clearTimeout(timer);
           timer = null;
        }
        process();
    });
    timer = setTimeout( function() {
        if (checkAvailable())
           process();
        }
    }, 10*1000 ); // waits 10 seconds before checking
 });

 function checkAvailable()
 {
     var available = true;
     $('img').each( function() {
         try {
             if (this.height == 0) {
                available = false;
                return false;
             }
         }
         catch (e) {
             available = false;
             return false;
         }
      });
      return available;
  }

  function process() {
      ... do the real work here
  }
7
tvanfosson

私はいくつかの役に立つかもしれないプラグインを書きました: http://plugins.jquery.com/project/window-loaded

5
2
alessioalex

$(window).loadの代わりに$(document).readyを使用すれば、問題は自然に解決すると思います jqueryドキュメント を参照してください。

2
TML

これがあなたが求めているものであるかどうかはわかりませんが、試しましたか(?):

$(document).ready(function(){
    ...
});

http://docs.jquery.com/Events/ready#fn

0
GreenieMeanie