javascript - 返回上一页后图像不隐藏

Question

我在单击按钮(取消隐藏图像)后显示一个加载屏幕，然后加载另一个页面。这很好用。

但是，如果用户点击“上一页”并返回。我的加载屏幕出现，所以它没有被隐藏。如果我手动刷新此页面就可以了。

这是我的代码。在 HTML 中:

<input id="saveForm" class="btn btn-info" type="submit" name="submit" value="Submit" onclick="load()"/>
<script>
     function load() {
          document.getElementById('loader').style.display='block';              
     }
</script>

<img class="load_spinner" id="loader" style="display:none;"/> 

在 CSS 中:

.load_spinner {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    opacity: 0.5;
    background: url(/static/img/Preloader_2.gif) center no-repeat #fff;
}

如果用户返回，我应该怎么做才能隐藏加载屏幕？

Answer 1

使用我的回答中的相同技术 here并使用 localStorage:

window.onload = function() {
  if (!localStorage.getItem("firstVisit")) {
    localStorage.setItem("firstVisit", "true");
  } else {
    document.getElementById("loader").style.display = "none";
};

或者实际上删除它:

document.getElementById("loader").parentNode.removeChild(document.getElementById("loader"));