使用后退按钮时移动浏览器上的 jQuery 延迟加载

Question

我正在尝试使用jquery的lazyload插件在我的web应用程序上延迟加载内容，并且在第一次加载页面时它工作得很好。这是我使用的代码:

    $(".lazy").lazyload({         
        effect : "fadeIn",
        container: $("#wrapper")
    });

问题出在浏览器的向后导航上。当用户转到新页面，然后使用延迟加载功能点击后退按钮返回页面时，不在浏览器视口(viewport)内的任何图像将继续良好地延迟加载，但最后在视口(viewport)内的任何图像都不会延迟加载。在页面更改之前未完成加载和显示将不会加载。因此，之前加载的图像和下一个加载的图像之间只有空白空间，未完成的图像所在的位置。

任何人都可以想出解决此问题的方法，以便在导航返回时，未完成加载的图像继续加载或重新加载吗？

Answer 1

阅读了一些文档后，我能够使用以下命令使其在所有浏览器中运行:

function myLoadHandler(evt)
{
    if (evt.persisted) {

        $(".lazy").lazyload({         
            effect : "fadeIn",
            container: $("#wrapper")
        });

        return;
    }

        $(".lazy").lazyload({         
            effect : "fadeIn",
            container: $("#wrapper")
        });
}

function myUnloadHandler(evt)
{
    if (evt.persisted) {
        $.noop();

        return;
    }

    $.noop();
}

if ("onpagehide" in window) {
    window.addEventListener("pageshow", myLoadHandler, false);
    window.addEventListener("pagehide", myUnloadHandler, false);
} else {
    window.addEventListener("load", myLoadHandler, false);
    window.addEventListener("unload", myUnloadHandler, false);
}