4 
$(".img").on("load",function () {...} );

発生するのはload次の場合です:

  • img はコンピュータに完全にダウンロードされていますか?

また

  • img はブラウザによって完全にレンダリングされますか?
4

3 に答える 3

4

仕様から：

load: load イベントは、DOM 実装がドキュメント内のすべてのコンテンツ、FRAMESET 内のすべてのフレーム、または OBJECT 要素の読み込みを完了すると発生します。

HTML5仕様からさらに具体的に:

ユーザー エージェントが要素の画像データを更新する場合img 、次の手順を実行する必要があります。

  1. 要素imgを使用不可の状態に戻します。
  2. フェッチアルゴリズムのインスタンスがまだこの要素に対して実行されている場合は、そのアルゴリズムを中止し、その アルゴリズムによって生成された保留中のタスクを破棄します。
  3. img要素の現在の画像データがあれば、それを忘れます。
  4. ユーザー エージェントが画像をサポートできない場合、または画像のサポートが無効になっている場合は、これらの手順を中止してください。
  5. 要素のsrc属性の値が空の文字列の場合、要素を壊れた状態に設定し、要素で指定された単純なイベントを発生させるタスクを キューに入れ、これらの手順を中止します。errorimg
  6. それ以外の場合は、要素に関連する要素の属性の値を解決srcし、それが成功した場合は、そのリソースを 取得します。このようにして得られたリソース[SIC]がimgエレメントの画像データです。画像をフェッチすると、リソースがフェッチされた後にネットワーク タスク ソースによってキューに入れられたタスク (以下で定義) が実行されるまで、要素のドキュメントのロード イベントを遅らせる必要があります。... リソースがフェッチされた後、ネットワーク タスク ソースによってキューに入れられたタスクは、次の選択肢を考慮して適切に動作する必要があります。

↪ ダウンロードが成功した場合

img要素を完全に利用可能な状態に設定し、画像の表示を適切に更新し、要素で名前が 付けられた単純なイベントを発生させるタスクをキューに入れます。loadimg

↪ そうでなければ

img要素を壊れた状態に設定し、error要素で名前が付けられた単純なイベントを発生させるタスクをキューに入れますimg。

これに基づいて、具体的には：

  1. img要素を完全に利用可能な状態に設定する
  2. 画像の表示を適切に更新し、
  3. 要素loadで名前が付けられた単純なイベントを発生させるタスクをキューに入れますimg

... load イベントは、画像がブラウザによって完全にレンダリングされた後にのみ発生します。

于 2012-04-29T13:54:39.173 に答える
2

これらの行を読んだ後：

イメージがロードされるとすぐに、ハンドラーが呼び出されます。

ブラウザのキャッシュに既に存在する画像の起動を停止することができます

「img は完全にコンピューターにダウンロードされました」という回答を理解しました

ソース

于 2012-04-29T13:56:38.390 に答える