0

短い言葉で言いますが、状況は次のとおりです。

for (var _im = 0; _im < slideshow._preloadbulks[slideshow._preloadCurrentbulk].length; _im++) {
    var tmpSlideIndex = (slideshow._preloadCurrentbulk*slideshow._preloadMaxbulkSize)+_im;
    slideshow._preloadSlides[tmpSlideIndex] = document.createElement('video');
    slideshow._preloadSlides[tmpSlideIndex].autoplay = false;
    slideshow._preloadSlides[tmpSlideIndex].loop = false;
    slideshow._preloadSlides[tmpSlideIndex].addEventListener('canplaythrough', slideshow.slideLoaded, false);
    slideshow._preloadSlides[tmpSlideIndex].src = slideshow._slides[tmpSlideIndex][slideshow.image_size+"_video_url"];
    slideshow._preloadSlides[tmpSlideIndex].addEventListener('error', function(){
        console.log(tmpSlideIndex);
        slideshow._preloadSlides.splice(tmpSlideIndex,1);
        slideshow._slides.splice(tmpSlideIndex,1);
        slideshow.slideLoaded();
    }, true);
}

ご覧のとおり、ビデオ配列があり、各要素 src を DOM にロードしてプリロードしています。それは問題なく動作しますが、1 つのリソースが n/a である状況に対処する必要があり、それを既存のアレイから削除する必要があります。addEventListener('error',は問題なく動作し、利用できないリソースを検出しますが、コンソールにtmpSlideIndexを記録しているときに、元のスライド インデックスではなく別の値を取得します (ループが続くため)。

ご覧のとおり、エラー ハンドラに useCapture フラグを設定してみました。

トリックはありますか？ありがとう！

4

1 に答える 1

1

問題は、変数のクロージャーを作成しているときに、子関数内でその変数を参照tmpSlideIndexできるようにすることですが、新しい変数を作成するわけではなく、ループが継続し、エラー ハンドラー関数が非同期で実行されるため、値ofは常にループの最後のインデックスになります。元の値を保持するために、 の値を渡す自己実行関数を作成できます。その自己実行関数は効果的に新しいスコープを作成し、最終的に、その親関数スコープに存在する変数のクロージャーを作成する関数を返します。tmpSlideIndextmpSlideIndexslideIndex

slideshow._preloadSlides[tmpSlideIndex].addEventListener('error', (function(slideIndex) {
    return function () {
        console.log(slideIndex);
        slideshow._preloadSlides.splice(slideIndex,1);
        slideshow._slides.splice(slideIndex,1);
        slideshow.slideLoaded();
    };
})(slideIndex), true);
于 2013-04-23T12:40:22.960 に答える