服务器上运行的代码（照片库）未定义提供TypeError变量的Javascript。同样的代码在本地工作

我把一个个人网站作为一个投资组合放在一起，我很难让一个照片库正常工作。我发现了一个我决定实现的免费Javascript库（）。当本地将页面放在一起时，javascript运行没有问题，但是当我将页面上传到站点（已经有很多其他javascript运行）时，我在页面上滚动时，或者在尝试通过单击“全屏”其中一个图像时，会出现以下错误：

TypeError: this._fullImgs is undefined

我试图隔离该问题，发现服务器上执行的代码行与本地不同，摘录如下：

Gallery.prototype._loadFullImgsDone = function() {

        var imgLoad = imagesLoaded(this._fullBox);
        imgLoad.on('done', function(instance) {
            var imgArr = instance.images;

            this._fullImgs = [];
            this._fullImgDimensions = [];
            this._fullImgsTransforms = [];

            for (var i = 0, ii = imgArr.length; i < ii; i++) {
                var rect = imgArr[i].img.getBoundingClientRect();
                this._fullImgs.push(imgArr[i].img);
                this._positionFullImgs.call(this, imgArr[i].img, i);
                this._fullImgDimensions.push(rect);
            }

            this._fullImgsLoaded = true;
        }.bind(this));
    };

执行方式不同。该网站位于id任何人都想看到自己的错误，我得到

提前感谢，我完全不知道如何修复此问题。

我看到（在该网站上）在加载图像之前调用了

resizeHandler

Gallery.prototype._handleScroll = debounce(function() {
    this._resetFullImg.call(this);  
}, 25);

Gallery.prototype._handleResize = function() {
    this._resetFullImg.call(this);
};

然后

this.\u resetFullImg

失败，因为尚未加载图像，这就是

this.\u fullImgs

为空的原因。代码中似乎有另一个名为

\u fullImgsLoaded

的变量，如果没有加载图像，则

\u resetFullImg

方法可能不会执行任何操作

您可以尝试添加如下内容：

// in material-photo-gallery.js line 1379
Gallery.prototype._resetFullImg = function() {

    if (!this._fullImagesLoaded) {
      return
    }

    this._fullImgsTransforms = [];

    for (var i = 0, ii = this._fullImgs.length; i < ii; i++) {
       ...

//在material-photo-gallery.js第1379行
prototype.\u resetFullImg=function（）{
如果（！this.\u fullImagesLoaded）{
返回
}
这个。_fullImgsTransforms=[]；
对于（变量i=0，ii=this.\u fullImgs.length；i

我不知道这将如何影响画廊代码的重置，但它可能会起作用。在您的生产系统上，页面加载时间（带有额外的JS和内容）可能会在事情准备就绪之前调用这些事件，这在本地是看不到的

---

祝你好运。

谢谢你的回复！你的代码在滚动时解决了错误，但在单击图像时仍然会出现相同类型的错误。这次是在material-photo-gallery.js的第1437行。遗憾的是，问题可能比我在无法真正调试的情况下所能理解的更严重。似乎“完成”事件永远不会发生激发，这意味着系统从未认为所有完整图像都在那里，尽管看起来它们已经加载。可能我添加的guard子句导致了问题，因为插件试图异步加载大图片。我建议将您的问题提交给图库作者，看看他们是否能对瘦图片有所帮助gs。我还有最后一个窍门要做。我将尝试手动创建图像并将其添加到“_fullImgs”中，看看这是否有效。因为这只是个人问题，我不介意每次图片更改时都调整它（这不会经常发生）。再次感谢

// in material-photo-gallery.js line 1379
Gallery.prototype._resetFullImg = function() {

    if (!this._fullImagesLoaded) {
      return
    }

    this._fullImgsTransforms = [];

    for (var i = 0, ii = this._fullImgs.length; i < ii; i++) {
       ...