为什么尝试使用jQuery预加载图像不起作用？

目前我有这个代码：

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( $('') .one('load', onLoad) .attr('alt', 'View from '+(i*360/imgCount)+'\u00B0') .attr('src', '/images/3d-spin/robot ('+i+').jpg') ); } 

但是，它表现得非常奇怪。 通常，我没有警报框。 但是，如果我打开开发人员工具并暂停脚本执行，我会收到一条说0警报。 不像一个好老的heisenbug！

这里有一个实例。 脚本本身称为style.js ，很明显图像已经加载。

我是在傻傻地做些什么，还是在玩jQuery？

Answer 1

如果图像已被浏览器缓存，则onload事件可能无法触发。 您可以做的是为具有complete属性集的图像手动触发load事件：

 container.prepend( $('') .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"); } );