如何让 window.onbeforeunload 等待动画？

发布于 2025-01-08 09:28:24 字数 254 浏览 0 评论 0原文

考虑以下 JavaScript 代码，并启动一个动画库（即 scriptaculous）。

window.onbeforeunload = function(event) {
    document.body.fade();
}

离开页面是瞬时的，无需等待动画完成。尽管我到处都看到人们说 JS 不支持线程，但这里有些东西正在并行运行，因为似乎一个不会等待另一个。我对线程的看法是否正确，有什么方法可以实现我在这里想做的事情吗？

原文

Consider the following JavaScript code, with an animation library (i.e. scriptaculous) to boot.

window.onbeforeunload = function(event) {
    document.body.fade();
}

Leaving the page is instantaneous and doesn't wait for the animation to complete. Even though everywhere I look people say JS doesn't support threads, something is running in parallel here, because it seems the one will not wait for the other. Am I right about the threads, and is there any way to achieve what I'm trying to do here?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

七颜 2025-01-15 09:28:24

有点晚了，但我认为给出答案对于未来的 SO 用户来说很有趣。

因此，有多种方法可以将您的代码同步到此，因此您应该添加一个自定义服务员。

window.onbeforeunload = function(event) {
    document.body.fade();
    while ((new Date()).getTime() < (new Date()).getTime()) + (1 *1000));
}

我想你也可以尝试用承诺：

function sleep(time) {
  return new Promise((resolve) => {
    setTimeout(() => {
      return resolve(null);
    }, time);
  });
}

window.onbeforeunload = async function(event) {
    document.body.fade();
    await sleep(1 * 1000);
}

A bit late but I think give an answer is interesting for futur SO users.

So there is multiple way to sync your code to this and so you should add a custom waiter.

window.onbeforeunload = function(event) {
    document.body.fade();
    while ((new Date()).getTime() < (new Date()).getTime()) + (1 *1000));
}

I guess you could also try with promises:

function sleep(time) {
  return new Promise((resolve) => {
    setTimeout(() => {
      return resolve(null);
    }, time);
  });
}

window.onbeforeunload = async function(event) {
    document.body.fade();
    await sleep(1 * 1000);
}

回复收藏 0 原文

~没有更多了~