Question

我已经阅读了一些帖子，这些帖子适用于人们，但它对我来说根本不起作用。这通常意味着用户错误，所以我做错了什么？我试过Firefox和Chrome。 .load（）处理程序在图像完全加载之前执行脚本。

function start() {
    $(document).ready(function(){
        $('#topIMG').attr('src', slides3[topI]);
        $('#bottomIMG').attr('src', slides3[bottomI]);
    });
    sT2 = setTimeout('checkTop()',1);
}
function checkTop() {
    $('#topIMG').load(checkBottom());
}
function checkBottom() {
    $('#bottomIMG').load(playGal());
}
function playGal() {
    $(document).ready(function(){ 
        $('#topIMG').delay(5000).fadeTo(750, 0, function(){
            topI++;
            bottomI++;
            if (topI == slides3.length) {
                topI = 0;
            }
            if (bottomI == slides3.length) {
                bottomI = 0;
            }
            $('#topIMG').attr('src', slides3[topI]);
        });
        $('#topIMG').fadeTo(1, 1, function(){
            $('#bottomIMG').attr('src', slides3[bottomI]);
        });
    });
    sT2 = setTimeout("checkTop()",1); 
}

Answer 1

尝试.load(checkBottom)和.load(playGal)。

Answer 2

我仍然无法让jquery的.load（）正常工作，但我创建了一个修复问题的javascript函数。故事的寓意是：当图书馆失败时，使用核心语言。

function checkLoad() {
    var topIMG = document.getElementById("topIMG");
    if(!topIMG.complete) {
        var checkT = setTimeout("checkLoad()", 250);
    }
    else {
        var bottomIMG = document.getElementById("bottomIMG");
        if(!bottomIMG.complete) {
            var checkT = setTimeout("checkLoad()", 250);
        }
        else {
            var playT = setTimeout("playGal()", 1);
        }
    }
}

Answer 3

如果您加载内嵌图像，每个event.function（如ready，load等）都会使图像可用。对于那些服务器能够使用PHP的人，请在服务器端使用：

 ob_start('ob_gzhandler');
 function img2base64($filename,$filetype,$cut=1){
     $imgbinary=fread(fopen($filename,"r"),filesize($filename));
     $out=base64_encode($imgbinary);
     if($cut==1)$out=chunk_split($out);
     return "data:image/".$filetype.";base64,".$out;
     } 
 echo "<img src='".img2base64("myimage.gif","gif")."'><br>";
 echo "My favorit Image<br>";
 echo "<img src='".img2base64("myotherimage.jpg","jpeg")."'>";
 ob_end_flush();

内嵌图像的大小很大，但如果浏览器能够解压缩，它们会被gz_handler压缩。大多数情况下他们是。因为jpg会再次压缩而gif会变小，我发现它很有用。抱歉，游览php。希望这是英语。

<强> PS 如果该图像不是其中之一，请考虑将base64编码图像作为样式类。您需要使用class / id属性加载div。

式：

.myImage{display:block;width:XXpx;height:XXpx;
         background-image:url("data:image/png;base64,zMzADMzMwAAZgBm...")
        }

体：

<div class="myImage">&nbsp;</div>

这太快了！顺便说一句谷歌不复制该图像。我的网站上有一个书架，每个样条都是一个图像。

Slow because of image post load.

Fast because of image style.

Answer 4

您想等待图片的onLoad事件。

Answer 5

您缺少的是整个异步模型。这意味着没有“等待”某事发生的功能。相反，你所做的就是提供一个回调。这意味着当foo完成后，执行此操作。首先发生的是开始：$(document).ready()在文档准备好时调用提供的函数。命令本身只是告诉浏览器记录文档准备好后要做什么。因此，在它注意到浏览器继续到下一行之后立即：setTimeout。此外，只有加载文档后，您开始加载的图像才会被加载。另外jQuery的加载：http://api.jquery.com/load/将url作为第一个参数加载，check参数或playgal都不返回url。

Answer 6

尝试

var img = new Image();
$(img).load(function(){
  // do if image loads
}).attr({
  src: someImgSource
}).error({
  //do if load fails
});

$（'＃foo'）。load（）不等待图像加载

6 个答案: