Javascript 创建图像和视频阵列时的奇怪行为（先加载视频或根本不加载视频）

我有一个JSON提要（通过

.ajax

长轮询检索），包含电影和图片链接。我想通过将所有图像和视频添加到阵列中来“预加载”它们

我希望媒体对象按照它们在提要中的顺序添加到阵列中。我有一个相当直接的脚本，在提要中循环，但下面是我遇到的：

当我编写代码将项目添加到阵列中时，如果我首先指定视频，则所有项目都会加载到阵列的前端（在添加提要中的任何图像之前，即使在任何电影之前都有图像）

这是我的密码：

//JSON Feed = http://app.sportstream.com/api/tagstream/tagStreamForStageTwoModeration?q=%7B%22customerId%22:%22ab.inch.2014%22,%22type%22:%7B%22$in%22:%5B%22image%22,%22video%22%5D%7D%7D&_=_ 

(It returns an array of entries)

for (var k = 0, j = entries.length; k < j; k++) {
    var limit = 0;
    if (idCheck.indexOf(entries[k].id) == -1) {
        if (++limit > 75) return;
        idCheck.push(entries[k].id);

        var mediaObject = new CustomMedia();

        //Placing this here will load all videos in feed to front of array

        if (entries[k].type == 'video') {
            mediaObject.isVideo = true; 
            mediaObject.url = entries[k]['ssMetaData']['videos']['standard_resolution']['url'];
            console.log('New VIDEO Loaded');
            contentArrayNew.push(mediaObject);
            if (!preLoadDone && boxCount != null) {
                if (contentArrayNew.length >= boxCount) {
                    preLoadDone = true;
                    imagesLoaded();
                }
            }
            //Checking if type == 'image' before video prevents any videos from loading
        } else if (entries[k].type = 'image') {
            mediaObject.isVideo = false;
            mediaObject.url = entries[k]['ssMetaData']['images']['standard_resolution']['url'];

            var img = new Image();
            img.onload = (function (entry) {
                return function () {
                    contentArrayNew.push(entry);
                    console.log('New IMAGE Loaded');
                    if (!preLoadDone && boxCount != null) {
                        if (contentArrayNew.length >= boxCount) {
                            preLoadDone = true;
                            imagesLoaded();
                        }
                    }
                }
            })(mediaObject);
            img.onerror = function () {
                console.log('error: bad image source');
            };
            img.src = mediaObject.url;

        }  else {
            console.log('Invalid media format');
        }
    }
}

//JSON提要=http://app.sportstream.com/api/tagstream/tagStreamForStageTwoModeration?q=%7B%22customerId%22:%22ab.inch.2014%22，%22类型%22:%7B%22$in%22:%5B%22图像%22，%22视频%22%5D%7D%7D&\u
（它返回一个条目数组）
for（var k=0，j=entries.length；k75）返回；
idCheck.push（条目[k].id）；
var mediaObject=new CustomMedia（）；
//将此放置在此处将把提要中的所有视频加载到阵列前面
if（条目[k]。类型=='video'）{
mediaObject.isVideo=true；
mediaObject.url=条目[k]['ssMetaData']['videos']['standard_resolution']['url']；
console.log（“新加载的视频”）；
contentArrayNew.push（mediaObject）；
如果（！preLoadDone&&boxCount！=null）{
如果（contentArrayNew.length>=boxCount）{
预加载完成=真；
imagesLoaded（）；
}
}
//在视频之前检查type==“image”是否阻止加载任何视频
}else if（条目[k]。类型='image'）{
mediaObject.isVideo=false；
mediaObject.url=条目[k]['ssMetaData']['images']['standard_resolution']['url']；
var img=新图像（）；
img.onload=（函数（条目）{
返回函数（）{
contentArrayNew.push（条目）；
log（“加载新图像”）；
如果（！preLoadDone&&boxCount！=null）{
如果（contentArrayNew.length>=boxCount）{
预加载完成=真；
imagesLoaded（）；
}
}
}
})（媒体对象）；
img.onerror=函数（）{
log（'error:bad image source'）；
};
img.src=mediaObject.url；
}否则{
console.log（“无效的媒体格式”）；
}
}
}

为什么不立即执行

contentArrayNew.push（mediaObject）

，而不是在

onload

函数中执行此操作？在预加载之前，我不想将任何媒体添加到数组中。然后需要在数组中放置一个空元素作为占位符。然后，在预加载图像时，将占位符替换为媒体对象。