Question

使用jQuery时，在开始执行操作之前等待DOM准备就绪。我的问题是图像。

有时图像需要很长时间才能加载，而且通常根本不需要。所以我想ready（）基本上有一个超时。它会等待5秒钟，如果这些选定的图像没有加载，它将运行该功能。

这可能吗？

Answer 1

我想你可能已经将window.ready与window.onload

混淆了

window.onload

这是一个在页面加载完毕后将触发的事件。所以这个功能不适合你，因为你需要等待所有图像完成下载（或超时）

<强>的document.ready

这是一个在DOM准备好后将触发的事件。这是当浏览器实际构建页面但仍可能需要抓取一些图像或Flash文件时。此功能将是您所追求的，因为在下载所有图像之前，DOM已准备好进行操作。

您可以在此功能中设置一个计时器等待5秒钟，然后检查您是否已下载所述图像

further reading

示例代码：

<script>
    $(document).ready(function() {
        var imagesLoaded = false;
        var imagesTimer = setTimeout("alert('images failed to load')", 10000);

        $("img.checkme").load(function(){
            imagesLoaded = true;
            clearTimeout(imagesTimer);
            alert('images loaded within 10 seconds')
        });
    });
</script>

Answer 2

- 编辑：这个答案不是确定的，只是有用的。

无视我。这是用于之后加载的图像。您希望在渲染时立即设置超时。在这种情况下，你会做一些稍微不同的事情。在渲染每个图像时，您将设置一个“启动”超时，如果“加载”在5秒之前没有取消，则启动您想要做的任何事情。

然而，可能会有一个比一般情况下可以附加的负载更早的事件。不确定。

- 旧：

确实，先生，我相信你应该能够加入'img''加载'事件。

可能是这样的：

// not tested, completely made up $("img").load({ alert("foo"); });

Answer 3

我有一个jQuery plugin等待在选择器的上下文中下载图像，然后将触发回调。

所以你可以......

$('body').waitForImages(function() {
  // Images have loaded.
});

$（document）.ready（）图像超时

3 个答案: