6

私はこことGoogleで、jQuery .load() イベントが発生するのはいつですか (もちろん、画像のロードイベントを意味します)? 画像を含むドキュメントが読み込まれているときの典型的な状況を意味するものではありません。

1/ 新しい img をドキュメントに追加:

$('<img src="picture.jpg" />').appendTo('body');

2/ 既存のイメージの src 属性を変更する:

$('img').attr('src' , 'new_path.jpg');

3/ 新しい img オブジェクトの作成:

var object = $('<img src="picture.jpg" />');

しかし、私にはわからないので、これらの状況はどうですか：

4/ ドキュメントに追加されていないオブジェクトに画像を追加する (DOM):

var o = $('<div></div>');
o.append('<img src="picture.jpg" />');

// つまり、oは DOM ツリーに存在しないため、追加されません

5/ ドキュメントに追加されていないオブジェクトへの imgs を含むコンテンツの読み込み:

var o = $('<div></div>');
o.load('url.html #pictures');

// つまり、oは DOM ツリーに存在しないため、追加されません

私は助けてくれてとても感謝しています...

4

3 に答える 3

2

4番については、メモリ内オブジェクトに追加されたときに1回だけ発火しているようで、DOMに追加されたときに再び発火することはありません。http://jsfiddle.net/JxHe4/のフィドルをチェックして、Chrome ツールまたは Firebug でネットワーク トラフィックとコンソール出力を確認してください。

動作は、Chrome、Firefox、IE9 間で一貫しているようです。これはあなたの質問の一部に答えますが（うまくいけば）、動作の理由は説明しません。私の推測では、これが指定されている方法です (すべてのブラウザーが同様に動作するため) が、onLoad イベントが正式に定義されている仕様が見つかりません。

番号 5 については、ページの読み込みによって画像の読み込みが影響を受けるとは思いません。最初にこれらの画像への参照を取得して、.Load ハンドラーをそれらにアタッチする方法がわかりません。

[アップデート]

HTML4 仕様からのこの抜粋は、ポイント 4 の動作を説明できます。埋め込みドキュメント (この場合は IMG) は、それが埋め込まれているドキュメントから完全に独立しています。たとえば、埋め込みドキュメント内の相対 URI は、メイン ドキュメントのベース URI ではなく、埋め込みドキュメントのベース URI に従って解決されます。埋め込まれたドキュメントは、別のドキュメント内 (たとえば、サブウィンドウ内) でのみレンダリングされます。それ以外は独立したままです。

于 2012-10-16T14:35:37.930 に答える
0

万一に備えて

4 - 要素を varoに追加できます。varoを DOM に追加すると、img を含む div が追加されます。

5 - の場合、varがページにダンプさo.loadれるまで、コンテンツはロードされません。oただし、コンソールで同じエラーが発生することはありません。

于 2012-10-16T14:36:28.320 に答える
0

ほとんどの場合、#4 はロード イベントをトリガーする必要があります (キャッシュされた画像に問題がある可能性があります)。の後の行にイベントをバインドする.load(url)と、画像がまだ存在しないため、イベントは発生しません。.load 呼び出しの成功に配置すると、バインドする前にトリガーされなかった場合にトリガーされる可能性があります (競合状態)。

于 2012-10-16T14:50:54.253 に答える