[JavaScript知识库]jquery 实现图片预加载

<script type="text/javascript">
	// 预加载
	function preloadImg(list, imgs) {
		var def = $.Deferred(),
			len = list.length;
		$(list).each(function(i, e) {
			var img = new Image();
			img.src = e;
			if (img.complete) {
				imgs[i] = img;
				len--;
				if (len == 0) {
					def.resolve();
				}
			} else {
				img.onload = (function(j) {
					return function() {
						imgs[j] = img
						len--;
						if (len == 0) {
							def.resolve();
						}
					};
				})(i);

				img.onerror = function() {
					len--;
					// console.log('fail to load image');
				};
			}
		});
		return def.promise();
	}
	var list = [
			'图片1.jpg',
			'图片2.jpg',//可以添加很多张
		],

		imgs = [];
	$.when(preloadImg(list, imgs)).done(

		function() {
			//预加载结束
			//do something here
		}
	);
</script>