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 以预加载它。它工作得很好，但我必须处理一个资源不适用的情况，然后我需要从现有数组中删除它。addEventListener('error',工作得很好，它检测到不可用的资源，但是当我将 tmpSlideIndex 记录到控制台时，我得到一个不同的值而不是原始幻灯片索引（因为循环继续）。

我已经尝试设置 useCapture 标志，正如您在错误处理程序中看到的那样，我认为这可以解决问题，但它不会。

有什么技巧吗？谢谢！

4

1 回答 1

1

问题是，当您在变量上创建闭包时tmpSlideIndex，它允许您在子函数中引用该变量，但它不会创建全新的变量，并且由于循环继续并且您的错误处理函数异步执行，因此值oftmpSlideIndex将始终是循环的最后一个索引。为了保持原始值，我们可以创建一个自执行函数来传递tmpSlideIndex. 该自执行函数将有效地创建一个新作用域，我们最终将返回一个函数，该函数将为slideIndex位于其父函数作用域中的变量创建一个闭包。

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 回答