Jquery加载隐藏时,图像被加载

Jquery loading hide when image is loaded

本文关键字:加载 图像 隐藏 Jquery      更新时间:2023-09-26

我有这个jquery捕获链接url(这个链接是一个图像),并简单地显示这个图像。我的问题是加载。我想显示加载和隐藏它时,图像完全加载。但是我不能,因为我的新图像没有类,我不知道如何检查它是否完成。

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

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/

谢谢

你可以这样做:

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

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

注意:

.load()方法<img />有时有一些问题,这个小插件修复所有(或很多)这些问题:imagesloaded