如何在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 with 'are you really sure you want to leave this page',

  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();
}

Answer 2

这并不是问题的直接答案，但对我有用：我没有在 pageonunload 上发送无效的数据，而是尝试使用 XMLHttpRequest 以一定间隔发送数据，效果很好。

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

How to execute a js function on pageunload

html

javascript

php

onbeforeunload