2

我使用 picturefill 作为响应式图像解决方法，并使用lazysizes 来延迟加载图像，并且效果很好。现在Internet Explorer（11）的控制台出现了一些错误：

Unable to get property 'push' of undefined or null reference

消息的打印屏幕： 在此处输入图像描述

候选人似乎是空的或未定义的，但我不能完全确定它，因为它适用于其他任何地方，并且在图像或 IE 中的 HTML 中也没有可见的错误。只有在使用lazysizes 时才会出现错误，而仅使用picturefill 似乎并非如此。

这是我如何将图片元素与lazysizes一起使用的示例：

<picture>

<!--[if IE 9]><video style="display: none;"><![endif]-->

<!-- Desktop -->
<source data-srcset="image-desktop.jpg 1x, image-desktop-2x.jpg 2x" media="(min-width: 1024px)" class="lazyload lazypreload">

<!-- Tablet -->
<source data-srcset="image-tablet.jpg 1x, image-tablet-2x.jpg 2x" media="(min-width: 704px)" class="lazyload lazypreload">

<!-- Mobile Big -->
<source data-srcset="image-mobile-big.jpg 1x, image-mobile-big-2x 2x" media="(min-width: 384px)" class="lazyload lazypreload">

<!--[if IE 9]   ></video><![endif]-->

<!-- Default Mobile -->
<img class="picturefill__image class="lazyload lazypreload" data-srcset="image-mobile.jpg 1x, image-mobile-2x.pg 2x" src="loader.gif" />

</picture>

图片填充脚本使用 requireJS 加载到页脚中，如下所示：

var picturefill = require('picturefill');

lazysizes 脚本也加载在页脚中，与使用 requireJS 的图片填充方式相同。它在图片填充之前加载。

关于这里有什么问题的任何想法？我错过了什么？

更新：看起来错误发生在这里（picturefill.js）：

imageData.sets = [];

if ( hasPicture ) {
    imageData.pic = true;
    getAllSourceElements( parent, imageData.sets );
}

然后将第二个变量用作引发未定义错误的候选者：

function getAllSourceElements( picture, candidates ) {
   ...
4

0 回答 0