Question

add.php

<script type="text/javascript">
$("img").load(function() {
     alert("all images loaded");
});
</script>
<?php 
function resim1(){
?>
<img height="150" weight="150" src="http://uyarer.com/linux/deneme.png"/>
<?php
}
?>

<?php 
function resim2(){
?>
<img height="150" weight="150" src="http://hunturk.net/resim-cnNtL2dhbGVyaS9iYXlyYWsvZTc4M2NlYzRlYi5qcGc=-1024-768.png"/>
<?php
}
?>
<?php 
 resim1();
 resim2();
?>

执行此代码时，每个加载图像的jquery警报。我用ajax导入了这个php页面另一个php。

例如

1.jpg警报＆gt;装 2.jpg警报＆gt;装载

但我想要

1.JPG 2.JPG 警报＆gt;所有图片都已加载

我想我改变了这段代码

$(**"img"**).load(function() {
 alert("all images loaded");

}）;

由于

Answer 1

缓存图像时，加载事件不会始终触发。有jquery plugin来解决此问题。

Answer 2

var imgNum=$('img').length;
$('img').load(function(){
    if(!--imgNum){alert('All images loaded')}
})

我认为此代码可以帮助您

Answer 3

var imgSize = 0;
var loaded = 0;
var _tim = 0;
$(document).ready(function()
{
 imgSize = $('img').size();
 $('img').load(function() {
   loaded++;
   clearTimeout(_tim);
  _tim =   setTimeout(function() { if(imgSize == loaded) { alert('all images are loaded'); }, 200);
});
});

Answer 4

var imagesPre = new Array;
var success = new Array;

$('img').each(function(){
  imagesPre.push(this.src);
});

for (i = 0; i < imagesPre.length; i++) {
    (function(path, success) {
        image = new Image();
        image.onload = function() {
          success.resolve();
        };
        image.src = path;
    })(imagesPre[i], success[i] = $.Deferred());
}

$.when.apply($, success).done(function() {
  alert("All image!");
});

加载所有图像后，执行代码

4 个答案: