我有一个包含大约 100 张图像的列表的页面，如果用户只查看大约 100 张图像，我不希望浏览器必须加载所有图像。 10 个。
所以我在我的页面上尝试了 jQuery.lazyload 插件。
如果我写:
$( function() {
$('.list li img').lazyload( { placeholder: 'n.gif' } );
});
代码:
<ul class="list">
<li><img src="myawesomeimage.jpg"></li>
</ul>
浏览器在延迟加载应用于图像之前加载图像。 我在没有文档就绪构造的情况下在图像标签下方尝试了 lazyload - 结果相同
我通过记录对图像的访问的 php 脚本代理图像加载 - 它仍然在开始时加载所有内容...
有人有想法吗？
最佳答案
您是在本地还是通过互联网连接进行测试。我唯一能想到的是，如果您在本地或本地网络上进行开发，图像加载速度会如此之快，以至于插件在加载完成后才会执行。调试它的一种方法可能是使用 Firebug 网络选项卡。在延迟加载执行之前添加一个 $.ajax 调用到任何重要的地方，然后检查网络选项卡以查看 AJAX 请求何时发出以及图像何时加载。如果一切顺利，您将在图像请求之前看到 AJAX 请求。如果您没有看到任何图像请求，请确保您正在查看“全部”组。
此外，确保在测试所有这些时禁用缓存，否则浏览器将立即从缓存中加载图像。
最后，我注意到插件创建者提到它在与 jQuery 1.3 配对时在 IE 中不起作用。你在什么浏览器中测试？
关于javascript - jQuery 延迟加载插件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/2101701/