Question

所以我在HTML文档（la Snapchat）中测试这个短暂的图像功能。

我的图像在X秒内可见，之后页面重新加载并且显示的图像消失。除了可以保存像这样的图像的无数方式之外，我现在正专注于刷新功能。

我刷新页面的JS代码如下：

<script>
window.setTimeout(function () {
    window.location = "example.com/page.html?nocache=" + (new Date()).getTime();
}, 5000); // refresh/redirect after 5 seconds.
</script>

我编写的代码会在单次刷新后破坏图像 - 因此上述触发器完美运行。但问题是浏览器上的后退按钮。如果你按它，你只需再次看到图像。游戏结束了！

我已经在HTML文档中包含了以下元标记，但它们没有帮助：

<meta http-equiv="Cache-Control" content="max-age=0">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">

有没有办法确保从等式中删除浏览器后退按钮，或者其效果是否已中和？请指教。

Answer 1

不要刷新页面，而是使用简单的DOM操作来删除图像。如果你加载了jQuery，你可以轻松地这样做：

<script>
window.setTimeout(function () {
    $( 'img' ).remove();
}, 5000); // refresh/redirect after 5 seconds.
</script>

（如果页面上有多个图片，您会想要使用更具体的选择器）

要在此上下文中加载新图像，您需要使用AJAX请求，并设置新计时器。但这会导致后退按钮无法恢复图像。

浏览器上的后退按钮可以访问无缓存页面

1 个答案: