7

当用户离开页面时,我使用 JQuery 来捕获卸载事件。这工作得很好,但我有数据只需要在用户真正想离开的情况下才需要保存。

这是我的catch-22。如果我过早地保存代码并且用户不想离开,我已经破坏了支持代码的 Web 服务的状态。

因此,只有在“beforeunload”对话框返回 true 时,我才需要完成几乎无法完成的代码执行任务。

$(window).on('beforeunload', function(e) {
    var info = * some info to save the current page state *
    return 'Are you sure you want to navigate away from the Test Runner?';

    //unreachable place where I wish I could ajax 'info' back to safety
});

此代码将弹出一个对话框,询问“您确定要离开测试运行器吗?” 如果用户点击取消将阻止用户离开页面。

这是另一个想法:

$(window).on('onunload', function(e) {
    var info = * some info to save the current page state *
    var r=confirm('Are you sure you want to stop the Test Runner?');
    if(r==true)
    {
        //place where I wish I could ajax 'info' back to safety
        return 'leaving'
    }
    else
        return 'leaving unsaved';
});

第二种方法不会阻止用户离开任何一种方式,但在一种情况下会先执行一些保存代码,而在另一种情况下会将它们引导回冷态。这种方法的问题在于,大多数浏览器(正确地)阻止确认框在 window.onunload 状态下启动,这要归功于 90 年代的 Web 开发人员用它来蒙蔽可怜的拨号网络冲浪者。

免责声明: 我很清楚,我们在 Web 开发人员社区中强烈反对阻止用户离开页面并在他们尝试这样做时在后台执行代码。当我看到诸如“如何防止用户离开我非常棒的网站”之类的问题时,我的下意识反应通常是“不要这样做!” 那就是说这不一样了。这是针对特定客户的专门页面,我们需要将其作为预防恐慌的措施。我保证,我是好人之一。我是你。

4

3 回答 3

7

尝试使用这两个事件。您需要的是同一范围内的共享变量,而不是全局变量。onbeforeunload将在对话框出现之前触发。onunload只有当用户单击以退出窗口/选项卡时才会被触发。

// Use a variable in the same scope of both events:
var savedState;

$(window).on('beforeunload', function(e) {

  savedState = "what the user currently made";

  return "Sure U are?";
});

$(window).on('unload', function(e) {

  // user didn't save!!
  // your auto-save function:
  auto_save(savedState);

  // browser leaves this tab.
});

作为一个范围,我的意思是类似(function () { })();或任何其他(构造函数或函数)函数。

于 2013-04-03T18:38:22.997 回答
4

经过测试并在 chrome 中工作。

$(window).on('beforeunload', function () {
   return 'Are you sure you want to navigate away from the Test Runner?';
});
$(window).on('unload', function () {
   $.ajax({ url: '/default.aspx', async: false });
});
于 2013-04-03T18:56:38.160 回答
1

刚刚遇到你现在的经历

下面的链接是这个问题的一个很好的参考。

https://developer.mozilla.org/en-US/docs/Web/Events/unload

“文件处于特定状态:

  • 所有资源仍然存在(img、iframe 等)
  • 最终用户看不到任何东西
  • UI 交互无效(window.open、alert、confirm 等)
  • 错误不会停止卸载工作流”

所以你将无法在 beforepageunload 之后触发任何东西,因为它不会产生任何返回值

于 2015-03-17T09:47:22.440 回答