javascript - 无法理解 javascript 事件和函数

Question

这里是按原样工作的代码，一个经典的 onBeforeUnLoad 事件，位于 <script type="text/jscript"> 中我的 ASP 页面的标签:

window.onbeforeunload = function (e) {
        a = 1;
        e = e || window.event;
        e.preventDefault = true;
        e.cancelBubble = true;
        e.returnValue = "do you wish to save?";
}

现在，当我想做更复杂的事情时遇到两个问题:

1. 我不惜一切代价只希望它出现一次:

   var a = 0;
   
   window.onbeforeunload = function (e) {
   
       if (a == 0) {
           a = 1;
           e = e || window.event;
           e.preventDefault = true;
           e.cancelBubble = true;
           e.returnValue = "Wish to save?";
       }
   }
   
    //Does not work...
   

2. 我希望它能够运行在不与第一个组合时工作的其他功能:

   comfirmExit = function(){
       if (confirm("Wish to save?") == true) {
       document.getElementById('<%= btnEnregistrer.ClientID %>').click();
       }
    }
    // works, but not when combine to the first function
   

我试图将这一切放在一起...我希望卸载事件使我的确认框功能运行:

    window.onbeforeunload = function (e) {

        if (a == 0) {
            a = 1;
        comfirmExit = function(){
        if (confirm("Wish to save?") == true) {
        document.getElementById('<%= btnEnregistrer.ClientID %>').click();
            }
        }
    }

现在我意识到我距离成为 javascript 专家还很远......

Answer 1

beforeunload 事件不会为用户运行任何干扰性的 Javascript(即 alert、confirm 等)。

但是有一个解决方法，步骤应该是这样的:

• 创建一个 bool 标志来检查用户是否取消了页面的退出(默认 false)。

• 创建beforeunload事件处理程序，并检查游戏是否未启动已保存。

  • 如果它已经保存，那么，您什么也不做，让用户离开

  • 但如果不是，则将该 bool 标志更改为 true。

• 您保持一个间隔脏检查该变量是否为true，并且在任何时候，为用户保存游戏，然后将此变量设置为false再次。

因此，这样做可以确保用户在没有保存的情况下离开时始终会看到一条消息，并且如果他们取消退出，游戏将自动保存，从而使下一次尝试非常顺利。

看一下下面的例子。要测试它，请打开控制台，单击运行。然后，尝试再次单击“运行”，您将看到一条退出消息。如果您确认，您的控制台将不会显示任何内容。但是如果您取消它，那么您将保留在页面中，然后您尝试再次单击运行，您会看到不会出现任何消​​息，但控制台会记录true.

(function() {
  var game = { saved: false };
  var canceled = false;
  
  setInterval(function() {
    if (canceled) {
      game.saved = true;
      canceled = false;
    }
  }, 100);
  
  window.onbeforeunload = function() {
    if (!game.saved) {
      canceled = true;
      return 'Are you sure?';
    }
    else {
      console.log(game.saved);
    }
  }
})();