javascript - 在页面卸载时完成 jQuery 动画

Question

有没有一种方法可以在用户通过单击链接或单击后退/前进按钮离开页面之前执行 jQuery 动画。

似乎为响应卸载事件而制作动画肯定会涵盖用户可能离开页面的所有条件。

但是，新页面在动画完成之前加载。我可以忙着等待，但这不是很优雅。

或者，我可以拦截对 anchor 的点击。但这并没有考虑后退/前进点击以及可能导致用户离开页面的其他情况。

是的，我知道这种行为是不受欢迎的，因为它会让用户等待。但是，我试图在一种非常特殊的情况下这样做，我认为利大于弊。

Answer 1

用户使用他/她的浏览器切换网页的速度不在您的控制之下，而只在您的页面内。

有了新的jQuery 1.3 live() event listener ，您可以按照您的建议向所有 anchor 添加一个监听器，即使对于在声明监听器之后创建的所有新 anchor 也是如此:

$("a").live("click", function(){
  var href = $(this).attr("href");

  var animDuration = 1000;

  // Do animation here; duration = animDuration.

  setTimeout(function () {
    window.location = href;
  }, animDuration);

  return false; // prevent user navigation away until animation's finished
});