3

div (div ごとに 1 つ) 内の一連の画像をコンテナー (div) に追加した後、onload 関数を取得できないという問題に直面しています。

これは、一連の変数を含むループ内にあります

$('#container').append('<div class="tile" style="position:absolute; top:'+(i*size)+'px; left:'+(j*size)+'px; width:'+size+'px; height:'+size+'px; overflow:hidden;" ><img src="'+map[i][j]+'"/></div>');

すべての変数は問題なく、すべての画像は正しく読み込まれますが、これは決して機能しません

$('.tile img').live('load', function(){
console.log("loaded");
});

また

$('.tile img').on('load', function(event){
console.log("loaded");
});

新しい .on jQuery 関数を試してみましたが、うまくいきません..

編集 : [+] .on コードを追加 (ドキュメントの準備ができた直後に両方の関数が右上に配置されます)

4

2 に答える 2

10

更新:少し遊んでみましたが、次の戦略は、新しく作成されたイメージのロード イベントに対しても機能します。最初に画像を作成し、それを div に追加してからドキュメントに追加します。

http://jsfiddle.net/lucuma/sHGm9/1/

$('.slideshow').each(function(i) {

    var $img = $('<img src="..." />').on('load', function(){
        alert('loaded');
    });

    $(this).append( $('<div class="tile" style="" ></div>').append($img) );               
    // you'd need to just use your div example here

});

元の回答:

私は2つのことを考えることができます..追加する前にon/liveを追加するか、次のように変更します:

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

$img.on('load', function() {
    alert('loaded');
});

$('#slideshow').append($img);  // adapted for my example

http://jsfiddle.net/lucuma/sHGm9/

于 2012-05-29T23:09:25.240 に答える