为什么更改图像的src是异步的? [英] Why changing src of an image is async?

问题描述

我有这样的东西

<div id="container">
 <img id="screenFirstImg">
</div>

和js:

$('a.screenThumbLink').click(function(){

  console.log( $('#container').height() );
    $('img.screenFirstImg').attr('src','new src');
  console.log( $('#container').height() );

});

基本上，只需单击一个缩略图，即可更改screenFirstImage(具有更大的图像).但是console.log会显示完全相同的高度，这是不可能的，因为在我设置新的src之后，容器会变大.

Basically on the click of a tumbnail the screenFirstImage get changed (with a bigger image). But console.log shows the exact same number of the height and that's not possibile because after i set the new src the container gets bigger.

也许那是因为当我执行第二个console.log时，图像尚未加载.
加载img后如何获取.height?

Maybe thats because when i do teh second console.log the image hasn't loaded yet.
How can I get the .height after the loading of the img?

推荐答案

$("#container img").load(function () {
  console.log( $("#container").height() );
});

$('a.screenThumbLink').click(function(){
  $('img.screenFirstImg').attr('src','new src');
});

这篇关于为什么更改图像的src是异步的?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！