如何检查图像 url 是否已使用 jQuery 加载？

Question

我在这里有这段代码，其中有一个带缩略图的滑块，滑块大图像通过单击拇指将其变为下一个attr('src')，但我想仅在图像加载后更改该 src。这是我到目前为止提出的来源：

$('.thumb').click(function(){
    topImageSrc = $(this).data("bigimage");

    $(topImageSrc).load(function(){
        coverMain.attr('src',topImageSrc);
        main.fadeOut("slow");
    })
});

遗憾的是，这不起作用，因为 topImageSrc 只是大图像的路径变量，如下所示：/uploads/largeimages/pic1.jpg

如何强制它加载，然后检查它是否完成，然后应用新图像？

Answer 1

你可以这样做：

$('.thumb').click(function () {
    topImageSrc = $(this).data("bigimage");
    var topImage = $('<img>').attr('src', topImageSrc);
    $(topImage).load(function () {
        coverMain.attr('src', topImageSrc);
        main.fadeOut("slow");
    });
});

这将创建一个图像（不将其附加到任何位置），将其源设置为topImageSrc URL 并检查load 事件。