Question

我在一个小型网络应用程序上工作，我需要在用户刷新浏览器后显示确认对话框。我是使用window.onbeforeunload = function() { ...}来做的。问题是它不仅在刷新时调用，而且在提交后也调用。我有一个问题：我能否以某种方式找出window.onbeforeunload是由刷新还是由提交元素引起的？

Answer 1

您可以为各种事件编写事件处理程序，这些事件可以引导您离开页面并具有管理状态的标识符。然后，您可以在onbeforepageunload函数中使用此标识符来执行您要执行的任何操作。下面是一个代码示例，它查找输入类型submit并设置标识符。类似地，你可以有一个用于锚标签等等。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>

</head>
<body>
<form action="">
  <input type="submit" value="Submit">
</form>
</body>
  <script>
    var submit_was_clicked = false;

    window.addEventListener("beforeunload", function (event) {
      if(submit_was_clicked){
        console.log('submit button clicked')
      }else{
        console.log('on before unload');
      }
    });

    document.addEventListener("click", function(e) {
      if (e.target.type.toLowerCase() === 'submit') {
          submit_was_clicked = true;
      }
    }, true);
  </script>
</html>

JS：如何找出是谁造成了window.onbeforeunload（）：F5还是提交？

1 个答案: