Javascript 表单提交后的hHide动画

我在

div

中有一个始终运行的动画，但默认情况下它是隐藏的。我在表单

submit

上取消了它的隐藏，但不确定当页面更改时如何将其隐藏回去。这意味着，如果用户按下浏览器上的

back

按钮，页面仍被缓存（因此不会重新加载），动画仍会显示。我怎样才能解决这个问题？表单未使用

AJAX

HTML:

我试着加上

$(document).on( "pagechange", function() {
    ('#loader').hide();
});

但这并没有解决任何问题。

<div id="clickme">
Click here
</div>
<img id="book" src="book.png" alt="" width="100" height="123">


$( "#clickme" ).click(function() {
  // With the element initially hidden, we can show it slowly:
  $( "#book" ).show( "slow", function() {
    // Animation complete.
  });
});

点击这里
$（“#单击我”）。单击（函数（）{
//在元素最初隐藏的情况下，我们可以缓慢地显示它：
$（“#book”）.show（“slow”，function（）{
//动画完成。
});
});

---

使用callback（回调）

中的示例我认为您必须使用document.ready函数替换上一页上的页面更改函数

$（文档）.ready（函数（）{
（“#装入器”）.hide（）；
});

---

谢谢

如果页面没有使用ajax，那么它会完全刷新吗？如果是这样，则默认情况下应隐藏动画。如果您可以放置一个JSFIDLE，它将更容易帮助您默认情况下它是隐藏的，但在按下

提交

后，动画将显示，如果用户在表单提交重定向后返回（无需重新加载页面，只需快速按下后退并从缓存中获取上一页），动画仍然存在。问题不在jquery中，而是在页面缓存中，对吗？@kpblc Well jquery可能有一种方法可以检测何时从缓存中检索页面，或者何时重新显示页面，或者更可能是一个函数，该函数检测到submit按钮已完成执行，并且在重定向后将显示一个新页面。在重定向之前有一个钩子或类似的东西。谢谢，但是动画应该在页面加载完成后完成。如果我在回调中添加

$（'#loader'）.hide（）

，它会隐藏之前的动画。谢谢，但没有任何效果。如果页面没有重新加载，我认为不会调用

$（document）.ready（）

$(document).on( "pagechange", function() {
    ('#loader').hide();
});

<div id="clickme">
Click here
</div>
<img id="book" src="book.png" alt="" width="100" height="123">


$( "#clickme" ).click(function() {
  // With the element initially hidden, we can show it slowly:
  $( "#book" ).show( "slow", function() {
    // Animation complete.
  });
});