jquery .width() chrome 和 safari 问题

Question

我已在 css 中将图像的高度设置为某个值，并且宽度会自动修改，以便保留纵横比。我正在使用 .width() jquery 函数在 css 调整图像大小后获取图像的宽度。在 Firefox 和 Internet Explorer 中，这效果很好，但在 Chrome 和 Safari 中，每个图像返回的宽度始终为 0。我正在使用的代码如下:

var total=0; 
var widthdiv=0;
$(function(){
    $('.thumb').each(function(){
       widthdiv=$(this).width();
       total+=widthdiv;
       alert(widthdiv); //added so i can see what value is returned.
    });
});

以及图像的 CSS:

#poze img{
    height:80px;
    width:auto;
    border:0px;
    padding-right:4px;    
}

Answer 1

在 document.ready(您当前正在使用的)中，图像可能会也可能不会加载，如果它们不在缓存中，则可能不会加载。而是使用 window.onload event当图像加载时，如下所示:

var total=0; 
$(window).load(function() {
  $('.thumb').each(function() {
    total += $(this).width();
  });
});