jquery - 尝试使用 jquery 找到图像的真实宽度

Question

我正在尝试使用以下代码找到图像的“真实”宽度：

$(document).ready(function( ) {
   $('.pageContent img').each(function(){
        var theImage = new Image();
        theImage.src = $(this).attr("src");
        var imageWidth = theImage.width;
        console.log(imageWidth);
   }
}

我遇到的问题是每次重新加载页面时结果都不同。一些 imageWidth 为 0。知道为什么会发生这种情况吗？

这是使用 Jquery 1.9.1 和 Chrome。

谢谢。

Answer 1

 Some imageWidth are 0. 

原因是您在将其渲染到 DOM 之前计算宽度。

改用onLoad方法。这样您将获得准确的图像，因为它已经添加到DOM

$(window).load(function( ) {
  ----------calculations goes here
}

Answer 2

尝试使用 window.load （加载所有图像后将调用回调）

$(window).load(function( ) {
   $('.pageContent img').each(function(){
        var theImage = new Image();
        theImage.src = $(this).attr("src");
        var imageWidth = theImage.width;
        console.log(imageWidth);
   }
}