Question

我有这个抓住链接url的jquery（这个链接是一个图像）并且简单地显示这个图像。我的问题是装货。我想显示LOADING并在图像完全加载时隐藏它。但我不能，因为我的新图像没有课程，我不知道如何检查它是否完成。

如何正确显示和隐藏此加载？

JS

$(function() {
    $(".p").click(function(e){
        e.preventDefault();
        var element = $(this);
        var I = element.attr("href");

        $("#loading").show(); //SHOW LOADING

        $("#imgfull").empty();
        var img = $("<img/>").attr("src", I); // add new image
        $("#imgfull").append(img); // add new image

        $('#???').load(function(){
             //$("#loading").hide();    //hide loading?????
        })

    });

});

HTML

<a href="http://ilikewall.com/wp-content/uploads/2015/04/3d_wallpapers_hd.jpg" class="p">click to load</a>

<div id="loading">LOADING</div>
<div id="imgfull"></div>

http://jsfiddle.net/4g0n8asc/

谢谢

Answer 1

您可以这样做：

img.load(function(){
    $("#loading").hide();
})

示例:: http://jsfiddle.net/Frogmouth/4g0n8asc/2/

注意：

.load()上的
<img />方法有时会遇到一些问题，这个小插件会修复所有（或很多）这些问题： imagesloaded

加载图像时，Jquery加载隐藏

1 个答案: