Question

单击按钮后，将开始加载图像。我想要的是：当图像完全加载时，正在调用一个函数。

我之前已经问过这个问题，但每个答案建议使用onload事件，这不完全正确。根据W3C规范，onload不是IMG元素的有效事件。如果不是因为在某些情况下事件没有被解雇，那就不会打扰我了。

除非图像权重很大且加载过程需要一些时间（例如20秒），否则一切正常。我想onload事件可能会设置一些最长等待时间。带有沉重图像的示例代码（在Chrome上测试，您必须清除缓存以再次测试它，如果您有一些超快网，则可能需要使用更大的图像进行测试）：

$(new Image()).attr('onload', 'worksFunc()').attr('src', "http://wallpaperus.org/wallpapers/04/151/outer-space1-1472x6429-wallpaper-1634552.jpg").appendTo($('body'));

解决方案可能在jQuery中，但不一定。

Answer 1

当元素附加了文档时，

event有效，因此您需要在文档中附加<img/>元素然后尝试操作，请参阅示例代码

var img = new Image();
img.src = "http://hdwallpapers.us/wp-content/uploads/walls/thumbs/The-Treetop-Temple-Protects-Kyoto-Japan-1024x640.jpg";
img.style.display = "none";
img.onload = function(){
  alert("Image Loaded");
    this.style.display = "block";
}
document.body.appendChild(img);

您的代码有语法错误

（"）引用语法错误，您可以在内联事件代码中转义引号，因此请始终使用相反的引用"，'
您添加了匿名功能，但无法通话

jQuery代码

$(new Image()).attr('onload', 
     'var func = function(){ console.log("works!"); }; func.call(this);')
.attr('src', "http://hdwallpapers.us/wp-content/uploads/walls/thumbs /The-Treetop-Temple-Protects-Kyoto-Japan-1024x640.jpg")
.appendTo($('body'));

加载图像后的功能 - 正确的方法

1 个答案:

jQuery代码