javascript - jQuery-如何查找是否从Ajax响应中加载了所有图像

我通过ajax调用用一些html更新了div内容，并且加载了ajax响应中的所有图像后，我该执行什么功能。

参见下面的代码，#gridWrapper来自Ajax响应，并且有很多缩略图。

success: function(Data){
 MyGrid.prepGridLayout(Data.html);
 $('#gridWrapper .thumbnail img').load(function(index) {
  MyGrid.updateCellWidth(this);
 });
 MyGrid.adjustGridWidth();
 MyGrid.animateGridLayout();
}

仅在加载所有图像后才需要执行MyGrid.animateGridLayout();。当前MyGrid.animateGridLayout();是在MyGrid.updateCellWidth(this);执行之前执行的

如何确保MyGrid.animateGridLayout();仅在加载所有图像后运行？

最佳答案

您可以让“加载”处理程序跟踪它们已经完成了多少次。

success: function(Data){
  MyGrid.prepGridLayout(Data.html);
  var thumbs = $('#gridWrapper .thumbnail img'), tc = 0;
  thumbs.load(function(index) {
    MyGrid.updateCellWidth(this);
    if (++tc === thumbs.length) {
      MyGrid.adjustGridWidth();
      MyGrid.animateGridLayout();
    }
   });
}

关于javascript - jQuery-如何查找是否从Ajax响应中加载了所有图像，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/3396254/