javascript - 如何在pageunload上执行一个js函数

Question

我正在制作一个小游戏，我想在用户离开页面时保存分数，我想在没有 jquery 或其他库的情况下执行此操作，这可能吗？

我通过执行一个创建表单并自动提交它的 javascript 函数来保存分数，因此它的数据被发送到服务器:

function sendData() {
    var form = document.createElement("form");
    form.setAttribute("method","post");
    form.setAttribute("action", "submit.php");
    form.setAttribute("id","returnForm");

      var formContent1 = document.createElement("input");
      formContent1.setAttribute("name","gamesPlayed");
      formContent1.value = gamesPlayed;  //parameter 1

      var formContent2 = document.createElement("input");
      formContent2.setAttribute("name","totalSteps");
      formContent2.value = totalTurns;   //parameter 2 

    form.appendChild(formContent1);
    form.appendChild(formContent2);
  document.body.appendChild(form);
  document.getElementById("returnForm").submit();
}

我发现了一些东西，比如，这个函数会弹出一个窗口，上面写着“你真的确定要离开这个页面吗”，

  window.onbeforeunload = function(e) {
    return false; 
  }

但是当我尝试将“sendData()”函数放入其中时，它不起作用:

  window.onbeforeunload = function(e) {
    sendData();
  }

即使我把整个函数都放在里面:

  window.onbeforeunload = function(e) {
      var form = document.createElement("form");
      form.setAttribute("method","post");
      form.setAttribute("action", "submit.php");
      form.setAttribute("id","returnForm");

        var formContent1 = document.createElement("input");
        formContent1.setAttribute("name","gamesPlayed");
        formContent1.value = gamesPlayed;  //parameter 1

        var formContent2 = document.createElement("input");
        formContent2.setAttribute("name","totalSteps");
        formContent2.value = totalTurns;   //parameter 2 

      form.appendChild(formContent1);
      form.appendChild(formContent2);
    document.body.appendChild(form);
    document.getElementById("returnForm").submit();
  }

Answer 1

在 javascript 中使用 onunload 事件，如 this article .

window.onbeforeunload = function(e) {
    return 'Are you sure ?'; 
  }

window.onunload = function () {
 sendData();
}