3

現在、私はこのコードを持っています:

var imgCount = 36;
var container = $('#3D-spin');

var loaded = 0;
function onLoad()
{
    alert(loaded);
    loaded++;
    if(loaded >= imgCount)
    {
        alert('yay');
    }
}

for(var i = imgCount-1; i >= 0; i--)
{
    container.prepend(
        $('<img>')
            .one('load', onLoad)
            .attr('alt', 'View from '+(i*360/imgCount)+'\u00B0')
            .attr('src', '/images/3d-spin/robot ('+i+').jpg')
    );
}

ただし、非常に奇妙な動作をしています。通常、アラート ボックスは表示されません。ただし、開発者ツールを開いてスクリプトの実行を一時停止すると、0. 古き良きハイゼンバグのようなものはありません！

実際の例はここにあります。スクリプト自体は と呼ばれstyle.js、画像がロードされたことは明らかです。

私は何かばかげたことをしていますか、それともjQueryがうまくいっていますか?

4

1 に答える 1

4

画像がブラウザによってキャッシュされている場合、onload イベントが発生しない可能性があります。できることは、completeプロパティが設定されている画像のロード イベントを手動で発生させることです。

container.prepend(
    $('<img>')
        .one('load', onLoad)
        .attr('alt', 'View from '+(i*360/imgCount)+'\u00B0')
        .attr('src', '/images/3d-spin/robot ('+i+').jpg')
        .each(function() { if(this.complete) $(this).trigger("load"); }
    );
于 2010-06-17T13:01:39.003 に答える