2

ここで説明されているように、jQuery の「ロード」イベントを理解しようとしています: http://api.jquery.com/load-event/。これまで一度も発動できなかった！

ここにいくつかのサンプルコードがあります。表示される唯一のコンソール メッセージは「DOM READY」です。単一のロード コールではありません。.load() の呼び出しを .bind('load',..) に置き換えても違いはありません。

   <!DOCTYPE html>
   <html>
   <head>
          <script src="lib/jquery.min.js"></script>
          <script>
           $(function(){
              console.log("DOM READY");
           });
           $(document).load(function(){
              console.log("Document Loaded");
           });
           $('#foo').load(function(){
              console.log("foo loaded");
           });
           $('#bar img').load(function(){
              console.log('image loaded');
           });
           $('#bar').load(function(){
              console.log('bar loaded');
           });
           </script>
   </head>
   <body>
     <div id="foo">Hellow world</div>
     <div id="bar">
        <img src="pics/pig.png"/>
     </div>
   </body>
   </html>

私は何を間違っていますか？

4

4 に答える 4

7

You cannot bind to items that don't yet exist. For instance, when you do the following:

$('#foo').load(function(){
    console.log("foo loaded");
});

The #foo item doesn't exist, so you cannot bind to its load event. Note also what the documentation has to say of the .load event itself:

This event can be sent to any element associated with a URL: images, scripts, frames, iframes, and the window object.

Your div elements don't "load".

于 2012-06-07T19:23:39.157 に答える
1

document.ready イベントを使用してバインディングを行う場合、要素が存在することが保証されます。

$(document).ready(function(){
    $('#foo').load(function(){console.log("foo loaded");});
}
于 2012-06-07T19:27:34.923 に答える
0

まさにジョナサンが言ったとおりです。例が必要な場合は、この Web サイトのドキュメントを参照することをお勧めします: http://api.jquery.com/ready/

それは非常に良い参照を持っています、そして私はあなたの例であなたがそれをシンプルに保ちたいと思っていることを理解しています。

于 2012-06-07T19:32:05.303 に答える
0

私はあなたの例を再現しようとしましたが、他の人が述べたように、DOM READ のみが起動しました。

また、スクリプトを変更し、負荷を img、a、div、および script 要素で動作させようとしました。誰も発砲しませんでした。

また、ウィンドウ オブジェクトを渡そうとしました (結局、これは「ウィンドウ」イベントです。これはうまくいきました。

私の結論は、jquery のドキュメントにもかかわらず、window オブジェクトでのみ機能するということです。

$(window).load(function(){
    alert("window loaded");
 });

私はクロムでのみテストし、言及した要素のみをテストしました。個人的には、document.ready 機能を使用します。ドキュメントによると、画像を含む .load はとにかくうまく機能しません。この特定の機能に関する多くの注意事項:

于 2012-06-07T20:11:36.750 に答える