javascript - jQuery，在我拥有一张图像的宽度后只继续脚本一次

Question

我需要知道一些图像的宽度才能在 div 表中很好地显示它。图像有一个类名。我这样做：

var image_width = $('.image_product').width();

之后，我通过结果计算表中的其他列。在 Firefox 中它运行良好。但是在 Chrome 中，计算脚本在加载图像之前就已经完成了。var image_width 返回 0 像素。

通过以下方式加载图像后，我尝试继续执行脚本：

$('.image_product').load(function() 
    {   
    calculate_column_width();
    });

这很好用，但我发现当有两个具有该类名的图像时脚本将运行两次，如果有三个图像则运行三次等等。

我找不到一个简单的解决方案让脚本只继续一次。谁有想法？

score 2 · Accepted Answer

使用该插件，以下代码：

$('.image_product').imagesLoaded(function() {   
  calculate_column_width();
});

... 只会在匹配容器中的所有图像都准备好后触发回调。

score 0 · Accepted Answer

你可以给他们不同的类名或者试试这个脚本：

$('.image_product').first().load(function() {   
    calculate_column_width();
});

然后它将只采用具有该类名的第一个元素。但我认为这不是解决您问题的可靠解决方案。

2 回答 2