使用jQuery

Question

我有一个设置默认属性的对象

var Gallery = function(container, opts) {
 this.$innerWrap = null;
 this.innerWrapWidth = 0;
 this.$slides = $(el).find('img');
};

现在稍后我用另一个函数扩展原型以计算this.innerWrapWidth的宽度，这是通过计算$innerWrap内的所有图像并将它们加在一起来完成的。

我有一个问题但与范围有关这是我的功能：

Gallery.prototype.calcWrapWidth = function() {
 var that = this;

 $(window).on('load', function() {
  $.each(that.$slides, function() {
   var slide = $(this);
   that.innerWrapWidth += slide.width();
  });
  that.$innerWrap.width(that.innerWrapWidth);
 });
 console.log(this.innerWrapWidth)
};

理想情况下，我会遍历数组中的所有图像，抓取宽度并将其设置在属性this.innerWrapWidth上，然后将值添加到this.$innerWrap。

我尝试设置var that = this;

但是当我运行console.log时，我得到0作为值返回。我无法找到在this.innerWrapWidth

上设置最终宽度的最佳方法

更新

我把它缩小了！如果我在that函数内部控制{。}}变量，我会得到我期望的值，但出于某种原因，运行window.load并不会设置宽度。元件。我可以确认内部包装绝对是一个jQuery对象，that.$innerWrap.width(that.innerWrapWidth);绝对是一个整数。

Answer 1

我似乎应该使用以下代码序列：

$(window).on('load', function() { 
  var myGal = new Gallery(..);
  myGal.calcWrapWidth();
});

并从$(window).on('load', function() {方法移除calcWrapWidth代码行。

这可确保在执行计算时页面上显示所有元素。